当我尝试初始化 Firebase Cloud Firestore 时，遇到以下错误：
未捕获的类型错误：WEBPACK_IMPORTED_MODULE_0_firebase .firestore 不是函数
我npm install firebase --save以前安装了firebase 。
import * as firebase from 'firebase';
import router from '../router';
const config = {
apiKey: "a",
authDomain: "a",
databaseURL: "a",
projectId: "a",
storageBucket: "a",
messagingSenderId: "a"
};
if(!firebase.apps.length){
firebase.initializeApp(config);
let firestore = firebase.firestore();
}
我通过导入多个库来修复它：firebase和firebase/firestore. 那是因为firebase核心库不包括 firestore 库。
import firebase from 'firebase/app';
import 'firebase/firestore';
首先，确保您拥有最新版本的 firebase：
npm install firebase@4.12.0 --save
接下来，添加 firebase 和 firestore：
const firebase = require("firebase");
// Required for side-effects
require("firebase/firestore");
初始化 Firebase 应用程序：
firebase.initializeApp({
apiKey: '### FIREBASE API KEY ###',
authDomain: '### FIREBASE AUTH DOMAIN ###',
projectId: '### CLOUD FIRESTORE PROJECT ID ###'
});
// Initialize Cloud Firestore through Firebase
var db = firebase.firestore();
来源：https : //firebase.google.com/docs/firestore/quickstart?authuser=0
import { firebase } from '@firebase/app';
import '@firebase/firestore'
如果您也使用身份验证
import '@firebase/auth';
希望这对在将 Angular 应用程序部署到 Firestore 时遇到同样问题的人有所帮助。
在 Angular 8 项目中，我在部署到 Firestore 时遇到了同样的错误。我通过添加另一个moduleAngularFirestoreModule 来修复它。
App.module.ts 是这样的：
...
import { AngularFireModule } from '@angular/fire';
import { AngularFirestore, AngularFirestoreModule } from '@angular/fire/firestore'; // << Note AngularFirestoreModule !!!
import { AngularFireDatabaseModule } from '@angular/fire/database';
...
imports: [
BrowserModule,
FormsModule,
AngularFireModule.initializeApp(environment.firebaseConfig),
AngularFirestoreModule,
AngularFireDatabaseModule,
...
包.json：
...
"dependencies": {
"@angular/animations": "~8.2.2",
"@angular/common": "~8.2.2",
"@angular/compiler": "~8.2.2",
"@angular/core": "~8.2.2",
"@angular/fire": "^5.2.1",
"@angular/forms": "~8.2.2",
"@angular/platform-browser": "~8.2.2",
"@angular/platform-browser-dynamic": "~8.2.2",
"@angular/router": "~8.2.2",
"ajv": "^6.10.2",
"bootstrap-scss": "^4.3.1",
"core-js": "^2.5.4",
"firebase": "^6.4.0",
...
更新：当我部署到其他托管服务提供商时，这没有帮助。对于这种情况，我添加了原始的 firebase 库并且它起作用了。
import { firestore } from 'firebase';
您可以使用凭据创建一个单独的组件，用于在您的应用程序上初始化 Firebase。
firebase-context.js
import * as firebase from 'firebase'
import 'firebase/firestore';
const firebaseConfig = {
apiKey: "XXXX",
authDomain: "XXXXX.firebaseapp.com",
databaseURL: "https://XXXX-app-web.firebaseio.com",
projectId: "XXXX",
storageBucket: "XXXX-app-web.appspot.com",
messagingSenderId: "XXXXXX",
appId: "1:XXX:web:XXXX",
measurementId: "G-XXXX"
};
export default !firebase.apps.length
? firebase.initializeApp(firebaseConfig).firestore()
: firebase.app().firestore();
如果需要处理数据库操作，不需要每次都调用初始化方法，可以使用之前创建的通用组件方法。
import FirebaseContext from "./firebase-context";
export const getList = () => dispatch => {
FirebaseContext.collection("Account")
.get()
.then(querySnapshot => {
// success code
}).catch(err => {
// error code
});
}