Which Firebase javascript package should be used with React Native? The regular “Firebase Web SDK ” or “react-native-firebase”?

Question

Firebase Web SDK - https://www.npmjs.com/package/firebase.

react-native-firebase - https://www.npmjs.com/package/react-native-firebase

My earlier understanding was that Web SDK might NOT offer all features in React Native. But now I'm facing a lot of crippling issues. I still haven't tried react-native-firebase.

One issues is that my project was working fine till last month. Now it shows errors when I try to write to firebase. The auth part works fine. Just the firestore gives error. Like so -

[Sun Apr 25 2021 19:43:33.243]  BUNDLE  ./index.js

error: Error: Unable to resolve module ./prebuilt.rn-cf004e03.js from D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\@firebase\firestore\dist\rn\index.js:

None of these files exist:
  * node_modules\@firebase\firestore\dist\rn\prebuilt.rn-cf004e03.js(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
  * node_modules\@firebase\firestore\dist\rn\prebuilt.rn-cf004e03.js\index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)    
> 1 | import firebase from '@firebase/app';
  2 | import '@firebase/util';
  3 | import '@firebase/logger';
  4 | import '@firebase/webchannel-wrapper';
    at ModuleResolver.resolveDependency (D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:168:15)
    at DependencyGraph.resolveDependency (D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\node-haste\DependencyGraph.js:353:43)
    at Object.resolve (D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\lib\transformHelpers.js:271:42)
    at resolve (D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\DeltaBundler\traverseDependencies.js:571:33)
    at D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\DeltaBundler\traverseDependencies.js:587:26
    at Array.reduce (<anonymous>)
    at resolveDependencies (D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\DeltaBundler\traverseDependencies.js:586:33)      
    at D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\DeltaBundler\traverseDependencies.js:275:33
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (D:\bareWorkflowRN\backup23\tester1PaymentsNPlacePicker\node_modules\metro\src\DeltaBundler\traverseDependencies.js:87:24)

I was wondering if react-native-firebase would be helpful here, or if someone knows the solution to this issue.

I have tries the cd android and gradlew clean commands

you should definitely use react-native-firebase. The web SDK is written for a browser and react-native does not have some features offered by browsers. — LonelyCpp

Kevin M. Mansour Kevin M. Mansour · Accepted Answer · 2021-05-02T19:53:35

As @LonelyCpp mentioned in comments you must use react-native-firebase which will give you more features and full features of React Native framework but Firebase Web SDK is only for native Javascript (Vanilla JS or Plain JS) which will works great for Web Browsers.

Which Firebase javascript package should be used with React Native? The regular “Firebase Web SDK ” or “react-native-firebase”?

1 Answers