GrapesJS / storage-firestore

Cloud Firestore storage wrapper for GrapesJS
BSD 3-Clause "New" or "Revised" License
36 stars 19 forks source link

ReferenceError: firebase is not defined #3

Closed KarimHesham closed 1 year ago

KarimHesham commented 2 years ago

I am receiving this error in the console when trying to integrate cloud firestore with grapesjs using grapesjs-firestore plugin.

Here is my code for setting up cloud firestore inside storageManager export const storageManager = { type: "firestore", };

This is grapes editor configuration import gjsFirestore from "grapesjs-firestore";

`import grapesjs from "grapesjs"; import gjsBlockBasic from "grapesjs-blocks-basic"; import gjsPluginExport from "grapesjs-plugin-export"; import gjsFirestore from "grapesjs-firestore"; import { blockManager, layerManager, deviceManager, styleManager, panels, addEditorCommand, storageManager, } from "../../utilities/grapes/index"; import { firebaseConfig } from "../firebase/firebase";

const editorConfig = (pageId) => { const editor = grapesjs.init({ container: "#editor", height: "100%", width: "100%",

plugins: [gjsBlockBasic, gjsPluginExport, gjsFirestore],
pluginsOpts: {
  gjsBlockBasic: {},
  gjsFirestore: {
    firebaseConfig,
    docId: pageId,
    collectionName: "pages",
  },
},
blockManager: blockManager,
layerManager: layerManager,
styleManager: styleManager,
deviceManager: deviceManager,
storageManager: storageManager,

panels: panels,

});

addEditorCommand(editor); };

export default editorConfig; `

and this is firebase configuration const firebaseConfig = { apiKey: process.env.REACT_APP_FIREBASE_API_KEY, authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN, databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL, projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID, storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET, messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID, appId: process.env.REACT_APP_FIREBASE_APP_ID, };

I am not sure exactly if i have missed something, but what i think is that as grapesjs-firestore plugin uses firebasev8, and I am using firebasev9 inside my project so I think that's why i get the error

artf commented 1 year ago

Yeah you should use the compat upgrade if you want to use this plugin with the v9 version

KarimHesham commented 1 year ago

Yeah you should use the compat upgrade if you want to use this plugin with the v9 version

Thank you!