Description
I'm migrating my codebase to use the firebase version 9 SDK and started to get this error once I started using v9 firestore. I've already migrated the auth part of my project and that works perfectly.
I should note, this only happens when I'm statically generating my website (npm run generate
) but not when building the site for SSR (npm run build
). During development (npm run dev
) I get no errors. The error turns up for every page that has to be generated. It seems to be referencing the messaging module but I'm not using messaging on every page. I've tried using "type": "module"
in my package.json but that hasn't helped. See an example of the error below:
ERROR /faqs C:\Users\simeon.ramjit\Documents\projects\covid19-tt\node_modules\@firebase\messaging\dist\index.sw.esm2017.js:1 import '@firebase/installations'; ^^^^^^ SyntaxError: Cannot use import statement outside a module at Object.compileFunction (node:vm:352:18) at wrapSafe (node:internal/modules/cjs/loader:1031:15) at Module._compile (node:internal/modules/cjs/loader:1065:27) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:102:18) at Object.<anonymous> (C:\Users\simeon.ramjit\Documents\projects\covid19-tt\node_modules\@firebase\messaging-compat\dist\index.cjs.js:8:10) at Module._compile (node:internal/modules/cjs/loader:1101:14) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:102:18) at Object.<anonymous> (C:\Users\simeon.ramjit\Documents\projects\covid19-tt\node_modules\firebase\compat\messaging\dist\index.cjs.js:3:1)
plugins/firebase.js
import firebase from 'firebase/compat/app' import 'firebase/compat/firestore' import 'firebase/compat/storage' import 'firebase/compat/messaging' import 'firebase/compat/functions' /*********************************** VERSION NINE ********************************** */ import { initializeApp, getApps } from "firebase/app"; import { getAuth } from "firebase/auth"; import { getAnalytics } from "firebase/analytics"; import { getFirestore } from "firebase/firestore" const firebaseConfig = { apiKey: '', authDomain: '', databaseURL: '', projectId: '', storageBucket: '', messagingSenderId: '', appId: '', measurementId: '' }; let firebaseApp; const apps = getApps(); if (!apps.length) { firebaseApp = initializeApp(firebaseConfig); } else { firebaseApp = apps[0]; } const db = getFirestore(firebaseApp, {}); const auth = getAuth(firebaseApp); if(process.browser){ const analytics = getAnalytics(); //enable analytics } /*********************************** END OF VERSION NINE ********************************** */ /*********************************** VERSION EIGHT ********************************** */ if(!firebase.apps.length){ const config = { apiKey: '', authDomain: '', databaseURL: '', projectId: '', storageBucket: '', messagingSenderId: '', appId: '', measurementId: '' }; firebase.initializeApp(config); } const fireDb = firebase.firestore(); const fireStorage =firebase.storage(); const fireFunctions =firebase.functions(); let fireMessage = ''; if(process.browser){ if(firebase.messaging.isSupported()){ fireMessage= firebase.messaging(); } else{ console.warn('[WARNING] Firebase Cloud messaging not supported'); } } /*********************************** END OF VERSION EIGHT ********************************** */ export{fireMessage, fireDb, fireStorage, fireFunctions, auth, db}
I know this may/ may not be a firebase specific issue but I'd appreciate any assistance in getting it resolved.
Node version: 16.13.1
Nuxt version: 2.15.8
Firebase version: 9.6.1