“从“firebase/app”导入 {initializeApp }”时出现 Firebase 导入错误；'在通过 npm 安装的 firebase 版本 10.3.1 中

Question

我想在我的项目中使用新的 firebase 模块化 API（如文档中所命名）。我通过

npm install firebase

从终端安装了 firebase （如文档中所示）。这创建了 2 个文件“package.json”和“package-lock.json”以及一个文件夹，即“node_modules”

然后开始使用 firebase，在我的 app.js 文件中我编写了以下代码：

import { initializeApp } from "firebase/app";

const firebaseConfig = {
  //My firebase config
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);

文档参考

在仅使用这段 js 和简单 html 打开我的 html 文件时，链接 js 文件......我在控制台中收到此错误

我浏览了互联网和其他堆栈溢出问题，但无法解决，

是的，我尝试过改变

import { initializeApp } from "firebase/app";

到

import initializeApp from "firebase/app";

仍然没有解决问题，相反，新的错误是

语法错误：意外的标识符“initializeApp”。导入呼叫 只需要一个参数。

我使用的是 firebase 版本 10.3.1（正如我从执行完操作后自动创建的 package.json 文件推断的那样）..这就是它的内容

我也从我尝试导入的其他内容（例如实时数据库和身份验证）中得到相同的语法错误 我们将非常感谢您的帮助！！

Answer 1

npm install firebase

问题在于如何从 html 链接 app.js 文件。解决方案是添加

import { initializeApp } from "firebase/app"

作为 script 标签的属性。

这篇文章解释得很好：

https://javascript.info/modules-intro

目前 import 语句仅在 ES6 模块中可用。