无法找到模块'firebase/app'或其类型声明的问题求助

我使用以下代码从firebase/app导入initializeApp：

import { initializeApp } from "firebase/app"

但触发错误提示：

Cannot find module 'firebase/app' or its corresponding type declarations.ts(2307)

已尝试卸载重装firebase、删除package-lock.json与node_modules后重新执行npm install，问题仍未解决。

tsconfig.json #

{
  "compilerOptions": {
    "target": "ES2017",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": [
        "./*"
      ]
    }
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    ".next/types/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}

package.json #

{
  "name": "yt-web-client",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@grpc/grpc-js": "^1.12.4",
    "firebase": "^11.0.2",
    "next": "15.0.4",
    "react": "^19.0.0",
    "react-dom": "^19.0.0"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "eslint": "^8",
    "eslint-config-next": "15.0.4",
    "typescript": "^5"
  }
}

解决方案 #

• 版本兼容性调整：Firebase 11.x与Next.js 15.x的组合可能存在适配问题，建议降级Firebase至稳定版本（如10.12.1），或确认Next.js 15对Firebase 11模块结构的支持情况。
• 修正导入路径：尝试在导入路径后添加.js后缀：

  import { initializeApp } from "firebase/app.js"
  

• 调整模块解析策略：将tsconfig中moduleResolution的值从bundler改为node16：

  "moduleResolution": "node16"
  

• 清除Next.js缓存：执行npx next clean清除缓存后重启开发服务器。
• 兜底安装类型声明：虽然Firebase v9+自带类型，可尝试手动安装@types/firebase：

  npm install @types/firebase --save-dev
  

内容的提问来源于stack exchange，提问作者ShaanPrk