2
votes

I am using Nuxt/Firestore in my web app. However, there was an issue in firebase sdk which created issue for firestore when using in Node. The issue is described here - https://github.com/firebase/firebase-js-sdk/issues/221

However, recently the issue has been closed, however, I still continue to face the same problem. The main issue is "Cannot find module 'grpc'" or 'firestore is not a function'.

I have created a dummy project that replicates this issue, which can be downloaded here: https://github.com/msahajwani/nuxt-firestore

To replicate the issue, follow these steps:

  1. Download the repo and install dependencies

  2. In ~/api/ folder, create a file called config.js and in that file add your firebase config as follows:

let config = { apiKey: 'xxx', authDomain: 'xxx', databaseURL: 'xxx', projectId: 'xxx', storageBucket: 'xxx', messagingSenderId: 'xxx' }

  1. Run the app using npm run dev

  2. You will notice that the app will load correctly at http://localhost:3000

  3. The home page has a navigation bar with link to Home and Top. If you click the 'Top' link, it will load correctly. This is because it was client side render.

  4. Now try to refresh or directly load the page http://localhost:3000/top in your browser. This will force Server Side Render and then you will see the errors. This is the problem that I have been struggling with.

Any help is greatly appreciated.

1

1 Answers

0
votes

Sorry for the confusion. https://github.com/firebase/firebase-js-sdk/issues/221 was fixed just recently and will be included in the next Firebase release. You can monitor the release notes (https://firebase.google.com/support/release-notes/js) to see when it has gone out (likely this Thursday).