Hi I’m starting with webpack and firebase. Everytime when I do :
import { initializeApp } from "firebase/app";
index.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>WElcome</title>
<script src="./main.js"></script>
</head>
<body>
Welcome
</body>
</html>
index.js:
import { initializeApp } from "firebase/app";
package.json:
{
"name": "dark",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack --mode development"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^5.75.0",
"webpack-cli": "^5.0.1"
},
"dependencies": {
"firebase": "^9.17.0"
}
}
I already tried to do it all over again but I installed firebase with npm i firebase in this folder, and always gives me the same error. What I’m missing ?
2
Answers
it is very complicated issue it maybe
firebase v- 9.17.0
is bugged, or it is The module you’re trying to import has a different casing orwebpack.config.js
. Issuebut for now you can run.
After some more consideration I find 2 more solutions :
1 you can import using /compact
Or, use the latest version :
Moved
exports.default fields
to always be the last field. This fixes a bug introduced in9.17.0
that prevented some bundlers and frameworks from building. For these build failures, the error text is: "Default condition should be last one".Ref : https://firebase.google.com/support/release-notes/js
According to firebase documents: Update imports to v9 compat. In order to keep your code functioning after updating your dependency from v8 to v9 beta, change your import statements to use the “compat” version of each import. For example:
Before: version 8
After: version 9 compat // v9 compat packages are API compatible with v8 code
Ref: https://stackoverflow.com/a/72186925