Problems with importing app-check

[DanijelL21]

Hi all,

recently I installed "npm install @react-native-firebase/app-check ".

my .js is currently

// External Libraries
import { initializeApp } from "firebase/app";
import { getDatabase } from "firebase/database";

// Internal Modules
import { firebaseConfig } from "../secrets/firebaseConfig";
const app = initializeApp(firebaseConfig);
console.log("APP", app);
const database = getDatabase(app);

export { database };

and when I add this line

import { initializeAppCheck } from "@react-native-firebase/app-check";

I get error

 ERROR  Error: Native module RNFBAppModule not found. Re-check module install, linking, configuration, build and install steps., js engine: hermes
 ERROR  Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called., js engine: hermes

my app versions are

"@react-native-firebase/app": "^21.6.1",
"@react-native-firebase/app-check": "^21.6.1",

can someone please help? Thank you.

[mikehardy]

import { initializeApp } from "firebase/app";
import { getDatabase } from "firebase/database";

Those are strange looking imports. Are those from firebase-js-sdk? Not sure you want to mix and match like that

This error message:

ERROR Error: Native module RNFBAppModule not found. Re-check module install, linking, configuration, build and install steps., js engine: hermes

Is the help. You have not installed / auto-linked the native modules correctly somehow. That's a project-specific problem.

Here's a demo that shows how to do it from npx react-native init on a new project, with comments, proving it works and tangentially proving that it's a project-specific problem so won't result in a change in this repo / is not actionable here

https://github.com/mikehardy/rnfbdemo/blob/main/make-demo.sh

[DanijelL21]

Hi @mikehardy

thank you very much for your help. For mentioned imports, I use npm install firebase . That is the only library that is working for me to use listeners (I spend a lot of days trying to configure that).

Do you maybe see the problem in my dependencies like this?

{
  "name": "app",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.23.1",
    "@react-native-firebase/app": "^21.6.1",
    "@react-native-firebase/app-check": "^21.6.1",
    "@react-native-picker/picker": "2.7.5",
    "@react-navigation/bottom-tabs": "^6.5.14",
    "@react-navigation/native": "^6.1.14",
    "@react-navigation/native-stack": "^6.9.22",
    "@react-navigation/stack": "^6.3.25",
    "@types/react": "~18.2.79",
    "axios": "^1.6.7",
    "expo": "~51.0.35",
    "expo-build-properties": "~0.12.5",
    "expo-dev-client": "~4.0.28",
    "expo-linear-gradient": "~13.0.2",
    "expo-status-bar": "~1.12.1",
    "firebase": "^11.0.2",
    "lottie-react-native": "6.7.0",
    "react": "18.2.0",
    "react-native": "0.74.5",
    "react-native-dropdown-select-list": "^2.0.5",
    "react-native-gesture-handler": "^2.20.0",
    "react-native-mail": "^6.1.1",
    "react-native-markdown-display": "^7.0.2",
    "react-native-pager-view": "^6.3.0",
    "react-native-safe-area-context": "4.10.5",
    "react-native-screens": "3.31.1",
    "typescript": "~5.3.3"
  },
  "devDependencies": {
    "@babel/core": "^7.24.0"
  },
  "private": true
}

[mikehardy]

Use firebase-js-sdk (npm add firebase) or use react-native-firebase (npm add @react-native-firebase/app and then whatever other modules you need)

But do not use them both at the same time, they do not interoperate - that is a "FirebaseApp" from firebase-js-sdk does not know about and does not work with or like a "FirebaseApp" from react-native-firebase.