错误:包路径 ./compat 未从包中导出 [英] Error: Package path ./compat is not exported from package
问题描述
注意:我想我能够重现这个(见 stackblitz 示例).控制台中打印的错误为INTERNAL ASSERTION FAILED: Expected a class definition
".这与我在本地得到的不同,但对我来说这看起来是同一个问题.
Note: I think I was able to to reproduce this (see stackblitz example). The error there is printed in the console as "
INTERNAL ASSERTION FAILED: Expected a class definition
". This is different to what I get locally but to me this looks like the same issue.
不管怎样,只要把app.component.ts
中的第15行注释掉,错误就会消失.
Anyway, just comment out line 15 in app.component.ts
and the error will disappear.
我正在尝试开始使用 Firebase,但是当我安装 &编译 Angular 项目时出现以下错误:
I am trying to get started with Firebase but when I install & compile the Angular project I am getting the following error:
未找到模块:错误:包路径 ./compat 未从包/home/sfalk/workspaces/web-mobile/node_modules/firebase 导出(请参阅/home/sfalk/workspaces/web- 中的导出字段mobile/node_modules/firebase/package.json)
有趣的是,我只有在注入 AuthService
时才会收到此错误,例如像这样:
The interesting thing is that I am only getting this error when I am injecting my AuthService
e.g. like this:
import {Component, OnInit} from '@angular/core';
import {FormBuilder} from '@angular/forms';
import {AuthService} from "../../../services/auth.service";
@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.scss']
})
export class RegisterComponent implements OnInit {
public loading = false;
constructor(
private formBuilder: FormBuilder,
public authService: AuthService,
) {
}
}
不会崩溃
import {Component, OnInit} from '@angular/core';
import {FormBuilder} from '@angular/forms';
import {AuthService} from "../../../services/auth.service";
@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.scss']
})
export class RegisterComponent implements OnInit {
public loading = false;
constructor(
// private formBuilder: FormBuilder,
// public authService: AuthService,
) {
}
}
认证服务
我不确定这个类是否导致了这个问题,我非常怀疑,但这是代码.没什么特别的.
AuthService
I am not sure if this class is causing the issue, I highly doubt it, but here is the code. Nothing special.
唯一要提到的可能是我从 @angular/fire/compat
导入,这是根据 docs.
The only thing to mention maybe is that I am importing from @angular/fire/compat
which is as intended according to the docs.
import {Injectable} from "@angular/core";
import {Observable, of} from "rxjs";
import {Router} from "@angular/router";
import firebase from "firebase/compat";
import {switchMap} from "rxjs/operators";
import {AngularFireAuth} from "@angular/fire/compat/auth";
import {AngularFirestore, AngularFirestoreDocument} from "@angular/fire/compat/firestore";
import User = firebase.User;
import auth = firebase.auth;
@Injectable({providedIn: 'root'})
export class AuthService {
public user$: Observable<User | null>;
constructor(
private afAuth: AngularFireAuth,
private afs: AngularFirestore,
private router: Router
) {
this.user$ = this.afAuth.authState.pipe(
switchMap(user => {
if (user) {
return this.afs.doc<User>(`users/${user.uid}`).valueChanges();
}
return of(null);
})
) as Observable<User>;
}
async googleSignIn() {
const provider = new auth.GoogleAuthProvider();
const credentials = await this.afAuth.signInWithPopup(provider);
return this.updateUserData(credentials.user);
}
async signOut() {
await this.afAuth.signOut();
return this.router.navigate(['/'])
}
// noinspection TypeScriptValidateTypes
private updateUserData(user: User | null) {
if (!user) {
throw "User is null."
}
const userRef: AngularFirestoreDocument<User> = this.afs.doc(`users/${user.uid}`);
const data: any = {
uid: user.uid,
email: user.email,
displayName: user.displayName,
photoURL: user.photoURL
}
return userRef.set(data, {merge: true});
}
}
在我的 package.json
中:
"@angular/fire": "^7.0.3",
"firebase": "^9.0.1",
另见
- Github 问题
推荐答案
您需要将导入更改为:
import firebase from "firebase/compat";
到
import firebase from "firebase/compat/app";
// ^^^
这篇关于错误:包路径 ./compat 未从包中导出的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!