programing

AngularFireModule 및 AngularFireDatabaseModule을 @angular/fire에서 찾을 수 없음

itmemos 2023. 7. 1. 08:05
반응형

AngularFireModule 및 AngularFireDatabaseModule을 @angular/fire에서 찾을 수 없음

저는 파이어베이스 실시간 데이터베이스를 각진 프로젝트에 구현하려고 노력하고 있으며, 첫 번째 단계 중 하나에 갇혀 있습니다.AngularFireModule 및 AngularFireDatabaseModule을 가져오는 중입니다.다음과 같은 오류가 발생합니다.

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

다음은 내가 그것들을 가져오는 방법입니다.

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

내가 뭘 빠트렸나요?명령을 통해 @angular/fire를 설치했습니다.

npm i firebase @angular/fire

그리고 소방용 도구도 설치했습니다.다음은 현재 설치한 Angular 패키지와 해당 버전의 목록입니다.

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

이 모든 것이 과도한 정보라면 사과하지만 저는 문제가 무엇인지에 대해 완전히 고정되어 있습니다.어떤 도움이라도 주시면 대단히 감사하겠습니다.현재 저는 호환성 문제나 최신 버전에는 더 이상 존재하지 않는 기능이 있을 것이라고 의심하지만 저는 정말 모르겠습니다.

AngularFire 7.0.0은 어제 번들 크기 감소 이점이 많은 새로운 API와 함께 출시되었습니다.

최고 수준의 수업 대신에AngularFireDatabase이제 더 작은 독립 함수를 가져올 수 있습니다.

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

초기화 프로세스는 구성을 지정하기 위한 보다 유연한 API를 가지고 있기 때문에 약간 다릅니다.

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

이전 API로 진행하려면 호환성 계층이 있습니다.

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

자세한 내용은 버전 7 업그레이드 문서를 참조하십시오.

2021년 9월 1일 현재 작동 중인 제 코드입니다.

import { AngularFireAuthModule } from "@angular/fire/compat/auth";
import { AngularFireModule } from '@angular/fire/compat';

const firebaseConfig = [
  AngularFireAuthModule,
  AngularFireModule.initializeApp(environment.firebase) // Your config
];

@angular/fire needs 대신 @angular/fire/compat를 사용하여 이와 같은 코드를 사용하는 모든 위치에서 이 작업을 수행합니다(예: @angular/fire/database --> @angular/fire/compat/database).

견본의

다음은 예입니다.

'@angular/fire/app'에서 {initializeApp을 가져오고 FirebaseApp}을(를) 제공합니다.

가져오기: [

    provideFirebaseApp(() => initializeApp(environment.firebase))

],

저도 비슷한 문제가 있습니다. 간단한 해결책은 아래와 같습니다.

use latest version of node,angular/cli.
Install latest firebase with npm i firebase.
Install @angular/fire with npm i @angular/fire.

지금은app.module.ts이와 같이 수입합니다.

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

언급URL : https://stackoverflow.com/questions/68939014/angularfiremodule-and-angularfiredatabasemodule-not-being-found-in-angular-fire

반응형