0
151
Viewsi cannot connect firebase to my html file
i am doing net ninjas JS course and in that there's a chapter for databases that uses firebase. but his code for firebase is fairly different from now and I'm struggling with npm and node.js. I followed the documentation from this and I'm getting an "Uncaught SyntaxError: Cannot use import statement outside a module". but when I add type="module" to app.js I get a different error "Uncaught TypeError: Failed to resolve module specifier "firebase/app". Relative references must start with either "/", "./", or "../"." below is my code:-
HTML :-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="app.js"></script>
</body>
</html>
JS:-
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getFirestore, collection, getDocs } from 'firebase/firestore';
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaS.....bFkMOXoRY",
authDomain: "modern.....irebaseapp.com",
projectId: "mode....nja",
storageBucket: "modern-j......ja.appspot.com",
messagingSenderId: "9635.....932978",
appId: "1:96350793.......cbf567939ae91512b",
measurementId: "G-HFN5111EHZ"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
everything is copy-pasted from the app that I created. please help
1 answers
Answer question0
Can you change your imports to this:
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.0.2/firebase-app.js";
import { getFirestore, collection, getDocs } from "https://www.gstatic.com/firebasejs/9.0.2/firebase-firestore.js";
You can find more info about it here.
You are using browser modules so you need to use those imports. This is what stands in the docu about it:
