javascript - 类型 'typeof import("/home/kartik/Desktop/Ecommerce/ecommerce/node_modules/firebase/index")' 上不存在属性 'auth'。ts(2339)
问题描述
我是 FireBase 的初学者,我正在尝试使用 Angular 使用 FireBase 实现 Google 登录。我在 auth 收到上述错误。我特此附上 package.json、package.lock.json 的 login.component.ts 和 dev 依赖项。
登录组件.ts
import { Component, OnInit } from '@angular/core';
import * as firebase from 'firebase';
import 'firebase/auth';
import {AngularFireAuth} from 'angularfire2/auth'
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
constructor(private afAuth:AngularFireAuth) {
firebase.default.database
}
ngOnInit(): void {
}
Login(){
this.afAuth.auth.signInWithRedirect(new firebase.auth.GoogleAuthProvider()) //error due to this line.
}
}
包.json
"dependencies": {
"@angular/animations": "~11.1.0",
"@angular/cdk": "^11.2.12",
"@angular/common": "~11.1.0",
"@angular/compiler": "~11.1.0",
"@angular/core": "~11.1.0",
"@angular/fire": "^6.0.4-canary.9a26fbe",
"@angular/forms": "~11.1.0",
"@angular/localize": "~11.1.0",
"@angular/material": "^11.2.12",
"@angular/platform-browser": "~11.1.0",
"@angular/platform-browser-dynamic": "~11.1.0",
"@angular/router": "~11.1.0",
"@ng-bootstrap/ng-bootstrap": "^9.1.1",
"angularfire2": "^5.4.2",
"bootstrap": "^5.0.1",
"firebase": "^8.6.2",
"firebase-tools": "^9.10.2",
"g": "^2.0.1",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.11.3"
},
包-lock.json
...
"@angular/fire": {
"version": "6.0.4-canary.9a26fbe",
"resolved": "https://registry.npmjs.org/@angular/fire/-/fire-6.0.4-canary.9a26fbe.tgz",
"integrity": "sha512-LVskM344FFLQ34Dyc6ngN6n+c8kZODm3T3Sdzu43P4wmpaoocL06/3HMvXlQiwBdE3bH+F+tdGu2VYxgQZCWCA==",
"requires": {
"tslib": "^2.0.0"
}
},
...
"angularfire2": {
"version": "5.4.2",
"resolved": "https://registry.npmjs.org/angularfire2/-/angularfire2-5.4.2.tgz",
"integrity": "sha512-7brktOHPObHgMnCN+QkakyCBr2mnxMxMSVLlEZ7OF70LjFIQz/RV3t5a7cH1SjystbY+kzR3qYvn/irlWs27/Q==",
"requires": {
"@angular/fire": "5.4.2"
},
"dependencies": {
"@angular/fire": {
"version": "5.4.2",
"resolved": "https://registry.npmjs.org/@angular/fire/-/fire-5.4.2.tgz",
"integrity": "sha512-QzB5d1wtqr9jxfsVNv2+569MlfK4/QrrpNy0IngOHdxS4FBbXqMOcx37iv1m2mzJv9zlGUddUX44IZP5Xfb3cw=="
}
}
},
解决方案
您的依赖项是旧的。我建议您更新它们并使用新语法:
import { AngularFireAuth } from '@angular/fire/auth';
import { AngularFirestore } from '@angular/fire/firestore';
import { AngularFireDatabaseModule } from '@angular/fire/database';
import * as firebase from 'firebase/app';
和firebase@7.24.0
有关于firebase身份验证的完整教程,我觉得非常有用;这是链接
旧的进口是
import { AngularFireAuthModule } from 'angularfire2/auth';
推荐阅读
- c - 程序在执行通过管道和 fork 给出的 shell 命令期间挂起
- machine-learning - 'TFOptimizer' 对象没有属性 'learning_rate'
- r - 在deseq中如何克服收缩?
- reactjs - 如何处理预检请求?
- php - 通过 AppServiceProvider.php 添加到视图时层次结构类别菜单中断
- javascript - Props 改变后执行一个函数
- sql - 无法运行spring boot程序
- android - 无法使用 MockServerResponse 读取 Json 文件
- java - 如何验证文件的内容是否与其扩展名匹配
- javascript - 如何在 React 中获取 JSON 输入并将其转换为 const 数组?