能否在Angular 6中使用angularfire2？

Question

我正在尝试为我的Angular 6应用程序添加Firebase支持，但是在添加angularfire2时遇到了问题。

npm install angularfire2 firebase

我经常收到警告，说我必须使用Angular 5。例如：

npm WARN angularfire2@5.0.0-rc.6.0 requires a peer of @angular/core@^5.0.0 but none is installed. You must install peer dependencies yourself.

今天能否在Angular 6中使用angularfire2？

编译时我收到了以下错误信息：

ERROR in node_modules/angularfire2/angularfire2.d.ts(3,10): error TS2305: Module '"/home/rrr/Projects/ng6test/node_modules/rxjs/Subscription"' has no exported member 'Subscription'.
node_modules/angularfire2/firebase.app.module.d.ts(10,22): error TS2720: Class 'FirebaseApp' incorrectly implements class 'FirebaseApp'. Did you mean to extend 'FirebaseApp' and inherit its members as a subclass?
  Property 'automaticDataCollectionEnabled' is missing in type 'FirebaseApp'.
node_modules/rxjs/Subscription.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Subscription'.

我试图安装rxjs-compat，但是之后我收到了另一个警告。

ERROR in node_modules/angularfire2/firebase.app.module.d.ts(10,22): error TS2720: Class 'FirebaseApp' incorrectly implements class 'FirebaseApp'. Did you mean to extend 'FirebaseApp' and inherit its members as a subclass?
  Property 'automaticDataCollectionEnabled' is missing in type 'FirebaseApp'.

- krk999

---

在 Github 上有一个已知的问题 (https://github.com/angular/angularfire2/issues/1576) ，你需要做的是运行 npm install firebase@4.12.1。 - Rafff

你找到解决方案了吗？如果没有，请尝试将angularfire2升级到最新版本：5.0.0-rc.7.2-next - 并且firebase升级到^4.13.1，同时安装rxjs-compat v.6。我已经使用这些版本和angular v.6使我的项目正常工作。请确保检查控制台以确保实际安装了这些版本。让我知道。 - ChrisEenberg

@ChrisEenberg不工作，我更新了“angularfire2”：“^5.0.0-rc.7.2-next”，“firebase”：“^4.13.1”，“rxjs-compat”：“^6.2.1”，仍然出现错误“node_modules/angularfire2/index”'没有导出成员'AngularFireModule'。 - ashishSober

Answer 1

我尝试过了，但我不能让 Angular 6 与 AngularFire2 的任何版本（最新版本：5.0.0-rc.7.2-next）配合使用。我想我们需要等待 AngularFire2 的下一个主要版本。

更新：
一个 临时 的解决方案是安装 rxjs-compat。
npm install --save rxjs-compat

- 6324

---

rxjs-compat解决了大部分的问题，但我仍然遇到了一些错误。您能告诉我使用哪个版本的firebase和angularfire2才能成功启动吗？ - user8923822

@qUest firebase 4.13.1 和 angualrfire2 5.0.0-rc.7.2-next。firebase 5.0+ 对我来说不起作用。 - 6324

Answer 2

尝试：

npm install firebase angularfire2@next --save

已在预发布版本中修复：

angularfire2@next

- WebDevDaniel

Answer 3

package.json

"dependencies": 
{
"@angular/animations": "^6.0.3",
"@angular/cdk": "^6.1.0",
"@angular/common": "^6.0.3",
"@angular/compiler": "^6.0.3",
"@angular/core": "^6.0.3",
"@angular/forms": "^6.0.3",
"@angular/http": "^6.0.3",
"@angular/material": "^6.1.0",
"@angular/platform-browser": "^6.0.3",
"@angular/platform-browser-dynamic": "^6.0.3",
"@angular/router": "^6.0.3",
"@firebase/app": "^0.3.3",
"angularfire2": "^5.0.0-rc.10",
"core-js": "^2.5.6",
"firebase": "^5.0.3",
"hammerjs": "^2.0.8",
"rxjs": "^6.2.0",
"rxjs-compat": "^6.2.0",
"zone.js": "^0.8.26"
}

app.module.ts

import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { AngularFireAuthModule } from 'angularfire2/auth';
import { environment } from '../environments/environment';

@ngModule

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        routing,
        FormsModule,
        HttpClientModule,
        AngularFireModule.initializeApp(environment.firebase),
        AngularFireDatabaseModule,
        AngularFireAuthModule

    ]
})

环境

firebase: {
    apiKey: "apikey",
    authDomain: "authDomain",
    databaseURL: "https://projectId.firebaseio.com",
    projectId: "projectId",
    storageBucket: "projectId.appspot.com",
    messagingSenderId: "messagingSenderId"
  }

- Leonidas Gorgo

---

欢迎来到 Stack Overflow！请不要仅仅把源代码抛在这里。友善地尝试给出一个好的答案描述，这样其他人会喜欢并点赞。参见：如何撰写一个好的回答？ - sɐunıɔןɐqɐp