在@angular/fire 中找不到 AngularFireModule 和 AngularFireDatabaseModule [英] AngularFireModule and AngularFireDatabaseModule not being found in @angular/fire

问题描述

我正在尝试将 Firebase 实时数据库实施到一个 angular 项目中，但我陷入了第一步.导入 AngularFireModule 和 AngularFireDatabaseModule.它给了我以下错误:

I am trying to implement Firebase Realtime Database into a angular project and Im getting stuck at one of the very first steps. Importing AngularFireModule and AngularFireDatabaseModule. It gives me the following error:

Module '"@angular/fire"' has no exported member 'AngularFireModule'.ts(2305)

Module '"@angular/fire/database"' has no exported member 'AngularFireDatabaseModule'.

这是我导入它们的方式:

And here is how I am importing them:

import {AngularFireModule } from '@angular/fire';
import {AngularFireDatabaseModule} from '@angular/fire/database'

我在这里遗漏了什么吗?我已经通过命令安装了@angular/fire

Am I missing something here? I have installed @angular/fire via the command

npm i firebase @angular/fire

并且还安装了 firebase 工具.以下是我目前安装的 Angular 软件包及其版本的列表:

and have also installed firebase tools. Here is a list of the Angular packages I currently have installed and their versions:

Angular CLI: 12.2.2
Node: 14.17.4
Package Manager: npm 6.14.14
OS: win32 x64

Angular: 12.2.3
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1202.2
@angular-devkit/build-angular   12.2.2
@angular-devkit/core            12.2.2
@angular-devkit/schematics      12.2.2
@angular/cli                    12.2.2
@angular/fire                   7.0.0
@schematics/angular             12.2.2
rxjs                            6.6.7
typescript                      4.3.5

如果这些信息过多，我深表歉意，但我完全不知道问题出在哪里.任何帮助将不胜感激.现在我怀疑是兼容性问题，或者可能是最新版本中不再存在的功能，但我真的不知道.

I do apologise if this is all excessive information but I am completely stuck as to what the issue is. Any help would be GREATLY appreciated. Right now my suspicion is that its a compatibility issue or perhaps a feature that doesnt exist anymore on the latest versions but I really dont know.

推荐答案

AngularFire 7.0.0 于昨天发布，其中包含一个新的 API，该 API 具有许多减少包大小的好处.

AngularFire 7.0.0 was launched yesterday with a new API that has a lot of bundle size reduction benefits.

您现在可以导入更小的独立函数，而不是像 AngularFireDatabase 这样的顶级类.

Instead of top level classes like AngularFireDatabase, you can now import smaller independent functions.

import { list } from '@angular/fire/database';

初始化过程也有点不同，因为它有一个更灵活的 API 来指定配置.

The initialization process is a bit different too as it has a more flexible API for specifying configurations.

@NgModule({
    imports: [
        provideFirebaseApp(() => initializeApp(config)),
        provideFirestore(() => {
            const firestore = getFirestore();
            connectEmulator(firestore, 'localhost', 8080);
            enableIndexedDbPersistence(firestore);
            return firestore;
        }),
        provideStorage(() => getStorage()),
    ],
})

如果您想继续使用较旧的 API，请使用 兼容层.

If you want to proceed with the older API there's a compatibility layer.

import { AngularFireModule} from '@angular/fire/compat'
import { AngularFireDatabaseModule } from '@angular/fire/compat/database';

查看第 7 版升级文档了解更多信息.

这篇关于在@angular/fire 中找不到 AngularFireModule 和 AngularFireDatabaseModule的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！