我正試圖將我的應用程式與Firebase資料庫連接起來,但我在app.module.ts上收到了4條錯誤資訊:
'"@angular/fire"'/span>沒有匯出成員'AngularFireModule'/span>。 ts(2305)。
'"@angular/fire/storage"'沒有匯出成員'AngularFireStorageModule'.ts(2305)
'"@angular/fire/database"'沒有匯出成員 'AngularFireDatabaseModule'.ts(2305)。
'"@angular/fire/auth"'沒有匯出成員'AngularFireAuthModule'.ts(2305)
這里是我的package.json檔案:
{
"name"。"gescable",
"版本": "0.0.1"。
"author": "Ionic Framework",
"主頁": "https://ionicframework.com/",
"scripts": {
"ng": "ng",
"start": "ng服務"。
"build": "ng build",
"test": "ng test"。
"lint": "ng lint"。
"e2e": "ng e2e".
},
"private": true,
"依賴性": {
"@angular-devkit/architect"/span>: "^0.1202.5",
"@angular-devkit/architect-cli": "^0.1202.5",
"@angular/common": "~12.1.1"。
"@angular/core": "~12.1.1",
"@angular/fire": "^7.0.4",
"@angular/forms": "~12.1.1"。
"@angular/platform-browser": "~12.1.1",
"@angular/platform-browser-dynamic": "~12.1.1",
"@angular/router": "~12.1.1",
"@ionic/angular": "^5.5.2",
"ajv": "^8.6.2",
"angularfire2": "^5.4.2",
"firebase": "^7.24.0",
"rxfire": "^6.0.0",
"rxjs": "~6.6.0",
"tslib": "^2.2.0",
"zone.js": "~0.11.4".
},
"devDependencies": {
"@angular-devkit/build-angular"。"~12.1.1"。
"@angular-eslint/builder": "~12.0.0",
"@angular-eslint/eslint-plugin": "~12.0.0",
"@angular-eslint/eslint-plugin-template": "~12.0.0",
"@angular-eslint/template-parser": "~12.0.0",
"@angular/cli": "~12.1.1",
"@angular/compiler": "~12.1.1",
"@angular/compiler-cli": "~12.1.1",
"@angular/language-service": "~12.0.1",
"@ionic/angular-toolkit": "^4.0.0",
"@types/jasmine": "~3.6.0"。
"@types/jasminewd2": "~2.0.3"。
"@types/node": "^12.11.1"。
"@typescript-eslint/eslint-plugin": "4.16.1",
"@typescript-eslint/parser": "4.16.1",
"eslint": "^7.6.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsdoc": "30.7.6",
"eslint-plugin-prefer-arrow": "1.2.2",
"jasmine-core": "~3.8.0"。
"jasmine-spec-reporter": "~5.0.0"。
"karma": "~6.3.2"。
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3"。
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0"。
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0"。
"ts-node": "~8.3.0"。
"typescript": "~4.2.4"。
"@angular-devkit/architect": "^0.1200.0",
"firebase-tools": "^9.0.0",
"fuzzy": "^0.1.3",
"inquirer": "^6.2.2"。
"inquirer-autocomplete-prompt": "^1.0.1",
"open": "^7.0.3",
"jsonc-parser": "^3.0.0".
},
"description": "一個Ionic專案"。
}
而這里是我的app.module.ts:
import { NgModule } from '@angular/core'/span>;
import { BrowserModule } from '@angular/platform-browser'。
import { RouteReuseStrategy } from '@angular/router'/span>;
import { IonicModule, IonicRouteStrategy } from '@ionic/angular'/span>。
import { AppRoutingModule } from './app-routing.module' ;
import { AppComponent } from ' ./app.component';
import { ClientPageModule } from './client/client.module' ;
import { environment } from './environments/environment'。
import { AngularFireModule } from '@angular/fire'/span>。
import { AngularFireAuthModule } from '@angular/fire/auth'/span>。
import { AngularFireStorageModule } from '@angular/fire/storage'/span>。
import { AngularFireDatabaseModule } from '@angular/fire/database'/span>;
@NgModule({
declarations: [AppComponent]。
entryComponents: [],
imports: [] 。
BrowserModule,
IonicModule.forRoot()。
AppRoutingModule。
ClientPageModule。
AngularFireModule.initializeApp(environment.firebaseConfig)。
AngularFireAuthModule。
AngularFireStorageModule。
AngularFireDatabaseModule。
],
providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }]。
bootstrap: [AppComponent]。
})
export class AppModule {}。
下面是我的tsonfig.ts檔案
"compileOnSave"/span>: false。
"compilerOptions": {
"baseUrl": "./"。
"outDir": "./dist/out-tsc",
"sourceMap": true。
"宣告"。false。
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true。
"target": "es2015"。
"模塊": "es2020"。
"lib": ["es2018", "dom"]
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters"。true,
"strictInputAccessModifiers": true,
"strictTemplates": true,
"skipLibCheck": true, "skipLibCheck".
}
}
uj5u.com熱心網友回復:
你需要像這樣添加 "compat"
import { AngularFireModule } from "@angular/fire/compat" 。
import { AngularFireAuthModule } from "@angular/fire/compat/auth" 。
import { AngularFireStorageModule } from '@angular/fire/compat/storage'/span>。
import { AngularFirestoreModule } from '@angular/fire/compat/firestore'/span>。
import { AngularFireDatabaseModule } from '@angular/fire/compat/database'。
uj5u.com熱心網友回復:
@angular/fire ^7.0.4不匹配這一個依賴。firebase ^7.24.0
要么你依賴firebase 9.0.2 - 或者降級到@angular/fire ^6.1.5。
請看我鏈接的檔案,它清楚地說明了這一點。
"@angular/fire"/span>。"~7.0.4"。
"firebase": "~9.0.2"。
此外,@ionic已經被@capacitor所取代,devkit進入devDependencies。
uj5u.com熱心網友回復:
非常感謝@AchrafBj和@martin-Zeitler。每件事情都能正常作業:
import { AngularFireAuthModule } from "@angular/fire/compat/auth" 。
import { AngularFireStorageModule } from '@angular/fire/compat/storage'/span>。
import { AngularFirestoreModule } from '@angular/fire/compat/firestore'/span>。
import { AngularFireDatabaseModule } from '@angular/fire/compat/database';`````
這里是鏈接https://firebase.google.com/docs/web/modular-upgrade。
Enjoy!!!!
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/319140.html
標籤:
