如何构建用于生产的 angularfire2

Question

运行使用 AngularFire2 的 Angular 应用程序的生产版本后，我仍然在控制台中看到以下警告：

It looks like you're using the development build of the Firebase JS SDK.
When deploying Firebase apps to production, it is advisable to only import
the individual SDK components you intend to use.
For the module builds, these are available in the following manner
(replace <PACKAGE> with the name of a component - i.e. auth, database, etc):
CommonJS Modules:
const firebase = require('firebase/app');
require('firebase/<PACKAGE>');
ES Modules:
import firebase from 'firebase/app';
import 'firebase/<PACKAGE>';

我的应用程序中唯一直接从firebase导入的地方是这里：

import { auth } from 'firebase';
...
constructor(private afAuth: AngularFireAuth) {}
...
login() {
this.afAuth.auth.signInWithPopup(new auth.GithubAuthProvider())
.then(result => {
console.log('sign in result', result);
})
.catch(e => console.error('error signing in'));
}

我的项目中所有其他与 Firebase 相关的代码都是从angularfire2导入的。我尝试按照这样的建议导入auth：

import firebase from 'firebase/app';
import 'firebase/auth';

但这行不通。 我做错了什么？

Answer 1

您必须导入 Firebase 应用程序

import * as firebase from 'firebase/app';

以及您在应用程序中使用的任何其他 Firebase 服务

import 'firebase/auth';
import 'firebase/database';
import 'firebase/firestore';
import 'firebase/messaging';
import 'firebase/functions';

在此处查看官方 Firebase 文档。

Answer 2

再加上这个问题，让我整天发疯......我正在使用Angular 6和最新的AngularFire2，并根据文档进行适当的导入。但是，我导入了firestore以获取对writeBatch类的访问权限。我终于意识到我错误地使用了错误的导入，这导致了Firebase开发SDK控制台警告。

因此，要在打字稿中导入像 writeBatch 这样的类，我必须更改：

import { firestore } from 'firebase';

自：

import { firestore } from 'firebase/app';

这删除了警告。我不认为文档提到为什么你会使用"firebase"而不是"firebase/app"，但在我查看js包文件之前，开发与生产之间的区别对我来说并不明显。希望这有帮助！

Answer 3

好的，我想我想通了。这有效：

添加以下导入：

import * as firebase from 'firebase/app';
import 'firebase/auth';

并替换：

new auth.GithubAuthProvider()

跟：

new firebase.auth.GithubAuthProvider()