即使模块已经安装，从“firebase”模块导入firebase也不能在reactjs中工作[重复]答案

【问题标题】：import firebase from "firebase" module not working in reactjs even the module is already installed [duplicate]即使模块已经安装，从“firebase”模块导入firebase也不能在reactjs中工作[重复]
【发布时间】：2021-10-29 05:33:53
【问题描述】：

显示这样的错误

/firebase.js:2:0
Module not found: Package path . is not exported from package C:\Users\krish\Desktop\FACEBOOK _CLONE\facebook_clone\node_modules\firebase (see exports field in C:\Users\krish\Desktop\FACEBOOK _CLONE\facebook_clone\node_modules\firebase\package.json)
Did you mean './firebase'?
Requests that should resolve in the current directory need to start with './'.
Requests that start with a name are treated as module requests and resolve within module directories (node_modules).
If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too.
  1 | 
> 2 | import firebase from 'firebase'
  3 | import 'firebase/firestore'
  4 | 
  5 | 

Import trace for requested module:
./Components\InputBox.js
./Components\Feed.js
./pages\index.js

https://nextjs.org/docs/messages/module-not-found

firebase 配置代码

import firebase from 'firebase'
import 'firebase/firestore'


// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
    apiKey: "fasdfsadfdsafjsafsafsfsfsfsfs",
    authDomain: "facebook-clone-13234.firebaseapp.com",
    projectId: "facebook-clone-13234",
    storageBucket: "facebook-clone-13234.appspot.com",
    messagingSenderId: "76247424324242",
    appId: "1:762470571881:web:20a2432424324424324424",
    measurementId: "G-9RDT591EEG",
};

const app = !firebase.apps.length
    ? firebase.initializeApp(firebaseConfig)
    : firebase.app();

const db = app.firestore();
const storage = firebase.storage();

export  {db,storage};

package.json 文件我已经使用 npm install firebase 安装了 firebase

{
  "name": "facebook_clone",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@heroicons/react": "^1.0.4",
    "firebase": "^9.0.0",
    "firebase-tools": "^9.16.6",
    "next": "11.1.0",
    "next-auth": "^3.29.0",
    "react": "17.0.2",
    "react-dom": "17.0.2"
  },
  "devDependencies": {
    "autoprefixer": "^10.3.3",
    "eslint": "7.32.0",
    "eslint-config-next": "11.1.0",
    "postcss": "^8.3.6",
    "tailwindcss": "^2.2.8"
  }
}

我正在使用 reactjs、nextjs 和 tailwind css 构建一个 facebook 克隆。为了添加我需要使用 firebase 的图像。使用 npm install firebase 安装 firebase 并从“firebase”导入 firebase 后显示错误

【问题讨论】：

试试这个import * as firebase from "firebase/app";
谢谢它的工作
@Krishnadev.V 的回答对你有帮助吗？
如果您希望使用新的模块化 SDK import {initializeApp} from "firebase/app" 或 import firebase from "firebase/compat/app" 继续使用旧的命名空间版本。您可以查看documentation 了解详细设置。

标签： reactjs firebase next.js npm-install

【解决方案1】：

试试这个：

import * as firebase from "firebase/app";

代替：

import firebase from 'firebase'

【讨论】：

【解决方案2】：

以这种方式导入

import * as firebase from "firebase/app";

【讨论】：