未找到模块：错误：无法解析“@firebase/app”Ionic Firebase

Question

我尝试将 firebase 包含到我的 Ionic 项目中，当我运行该项目时它会抛出这些错误，我看到我已经安装了它们，我遇到的问题是什么，这是我第一次使用火力基地

希望大家能帮我找出错误，谢谢大家 希望大家帮我找出错误，谢谢大家

[ng] ERROR in ./node_modules/@angular/fire/fesm2015/angular-fire-firestore.js
[ng] Module not found: Error: Can't resolve '@firebase/app' in 'D:\Proyectos\Ionic\DeliveryPiuraPublic\node_modules\@angular\fire\fesm2015'
[ng] ERROR in ./node_modules/@firebase/firestore/dist/index.cjs.js
[ng] Module not found: Error: Can't resolve '@firebase/app' in 'D:\Proyectos\Ionic\DeliveryPiuraPublic\node_modules\@firebase\firestore\dist'
[ng] ERROR in ./node_modules/@angular/fire/fesm2015/angular-fire.js
[ng] Module not found: Error: Can't resolve 'firebase/app' in 'D:\Proyectos\Ionic\DeliveryPiuraPublic\node_modules\@angular\fire\fesm2015'
[ng] ERROR in ./node_modules/@angular/fire/fesm2015/angular-fire-auth.js
[ng] Module not found: Error: Can't resolve 'firebase/auth' in 'D:\Proyectos\Ionic\DeliveryPiuraPublic\node_modules\@angular\fire\fesm2015'
[ng] ERROR in ./node_modules/@angular/fire/fesm2015/angular-fire-firestore.js
[ng] Module not found: Error: Can't resolve 'firebase/firestore' in 'D:\Proyectos\Ionic\DeliveryPiuraPublic\node_modules\@angular\fire\fesm2015'
[ng] ERROR in ./node_modules/@angular/fire/fesm2015/angular-fire-storage.js
[ng] Module not found: Error: Can't resolve 'firebase/storage' in 'D:\Proyectos\Ionic\DeliveryPiuraPublic\node_modules\@angular\fire\fesm2015'

packege.js

{
      "name": "DeliveryPiuraPublic",
      "version": "0.0.1",
      "author": "Ionic Framework",
      "homepage": "https://ionicframework.com/",
      "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
      },
      "private": true,
      "dependencies": {
        "@angular/common": "~8.2.14",
        "@angular/core": "~8.2.14",
        "@angular/fire": "^6.0.0",
        "@angular/forms": "~8.2.14",
        "@angular/platform-browser": "~8.2.14",
        "@angular/platform-browser-dynamic": "~8.2.14",
        "@angular/router": "~8.2.14",
        "@firebase/auth": "^0.14.4",
        "@firebase/auth-types": "^0.10.0",
        "@firebase/firestore": "^1.14.2",
        "@ionic-native/core": "^5.0.7",
        "@ionic-native/splash-screen": "^5.0.0",
        "@ionic-native/status-bar": "^5.0.0",
        "@ionic/angular": "^5.0.0",
        "@types/lodash": "^4.14.150",
        "cordova-android": "8.1.0",
        "core-js": "^2.5.4",
        "rxjs": "~6.5.1",
        "tslib": "^1.9.0",
        "zone.js": "~0.9.1"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "~0.803.20",
        "@angular/cli": "~8.3.23",
        "@angular/compiler": "~8.2.14",
        "@angular/compiler-cli": "~8.2.14",
        "@angular/language-service": "~8.2.14",
        "@ionic/angular-toolkit": "^2.1.1",
        "@types/jasmine": "~3.3.8",
        "@types/jasminewd2": "~2.0.3",
        "@types/node": "~8.9.4",
        "codelyzer": "^5.0.0",
        "cordova-plugin-device": "^2.0.2",
        "cordova-plugin-ionic-keyboard": "^2.2.0",
        "cordova-plugin-ionic-webview": "^4.2.1",
        "cordova-plugin-splashscreen": "^5.0.2",
        "cordova-plugin-statusbar": "^2.4.2",
        "cordova-plugin-whitelist": "^1.3.3",
        "jasmine-core": "~3.4.0",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~4.1.0",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "~2.0.1",
        "karma-jasmine": "~2.0.1",
        "karma-jasmine-html-reporter": "^1.4.0",
        "protractor": "~5.4.0",
        "ts-node": "~7.0.0",
        "tslint": "~5.15.0",
        "typescript": "~3.4.3"
      },
      "description": "An Ionic project",
      "cordova": {
        "plugins": {
          "cordova-plugin-whitelist": {},
          "cordova-plugin-statusbar": {},
          "cordova-plugin-device": {},
          "cordova-plugin-splashscreen": {},
          "cordova-plugin-ionic-webview": {
            "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
          },
          "cordova-plugin-ionic-keyboard": {}
        },
        "platforms": [
          "android"
        ]
      }
    }

app.module.ts

// firebase
import Config from './firebase';
import { AngularFireModule } from '@angular/fire';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFireStorageModule } from '@angular/fire/storage';
import { AngularFirestoreModule } from '@angular/fire/firestore';

Answer 1

我认为您应该从 package.json 中删除所有 firebase 库并删除 node_modules

只安装这两个

npm install firebase @angular/fire --save

安装后你可能会遇到兼容性问题，就像这里描述的link with solution

为避免此错误，您必须在 tsconfig.json 中设置一些选项。

tsconfig.json：

{
  //...
  compilerOptions: {
    "skipLibCheck": true,
    //...
  }
}