为什么无法解析模块说明符 "firebase/app"

Question

我的 JS 代码如下：

import { initializeApp } from "firebase/app";


const firebaseConfig = {
   //config object
  };

 
const app = initializeApp(firebaseConfig);

我很长时间以来一直收到此错误，希望有人能调查一下：

无法解析模块说明符“firebase/app”。相对引用必须以“/”、“./”或“../”开头。

Answer 1

您是否按照官方文档中的步骤进行了操作？

第 1 步：创建一个 Firebase 项目并注册您的应用程序
第 2 步：安装 SDK 并初始化 Firebase

此页面介绍了 Firebase JS SDK 版本 9 的设置说明，它使用 JavaScript 模块格式。

此工作流使用 npm 并需要模块捆绑器或 JavaScript 框架工具，因为 v9 SDK 已优化以与模块捆绑器一起使用以消除未使用的代码（摇树优化）并减小 SDK 大小。

2.a。使用 npm

安装 Firebase

npm install firebase

2.b。在您的应用中初始化 Firebase 并创建一个 Firebase 应用对象

import { initializeApp } from 'firebase/app';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);

在您的应用中访问 Firebase

Firebase 服务（如 Cloud Firestore、身份验证、实时数据库、远程配置等）可在单独的子包中导入。

下面的示例展示了如何使用 Cloud Firestore Lite SDK 检索数据列表。

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore/lite';
// Follow this pattern to import other Firebase services
// import { } from 'firebase/<service>';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

// Get a list of cities from your database
async function getCities(db) {
  const citiesCol = collection(db, 'cities');
  const citySnapshot = await getDocs(citiesCol);
  const cityList = citySnapshot.docs.map(doc => doc.data());
  return cityList;
}

你可以参考我下面官方link的回答

https://firebase.google.com/docs/web/setup

希望能帮到你。

Answer 2

最后我通过使用以下方法导入函数解决了我的问题：

import { function } from 'https://www.gstatic.com/firebasejs/9.6.3/firebase-SERVICE.js'

为什么无法解析模块说明符 "firebase/app"

Why unable to resolve module specifier "firebase/app"

javascript

authentication

reference

firebase

google-cloud-firestore