Angular 2和Firebase SDK

Question

我一直在努力让Angular2 快速启动应用程序与Firebase一起使用(请参阅此存储库).我安装了最新版本的Firebase,尝试使用SystemJS加载firebase(请参阅systemjs.config.js)并尝试导入firebase并使用该函数initializeApp(请参阅app.component.ts).但是,我一直firebase.initializeApp is not a function在浏览器控制台中收到错误.我是否正确使用SystemJS加载firebase.js？

注意:要复制错误,您应该能够执行npm install后跟npm start.

Answer 1

一个变化:来自

import * as firebase from 'firebase';

至

import {firebase} from 'firebase';

足以使您的示例与firebase 3.6一起使用.

但是,我说这是偶然的.firebase.js看起来根本不像一个模块,它不使用module.exports或amd define,它只是创建firebase具有以下属性的全局变量:

INTERNAL: Object
Promise: Promise()
SDK_VERSION: "3.6.4"
User: (a, b, c)
__esModule: true
app: a(a)
apps: (...)
get apps: ()
auth: (c)
database: (c)
default: Object
initializeApp: (a, c)
messaging: (c)
storage: (c)
__proto__: Object

可能是,它的存在__esModule使得SystemJS将它包装在另一个对象中 - 如果你在调试器中查看import * as firebase from 'firebase'它的结果,它包含单个属性,也称为firebase你需要的实际模块.

有趣的firebase.d.ts是,这是以这样的方式编写的

import {firebase} from 'firebase'; 

firebase.initializeApp(...);

有效,但看似平等

import * as firebase from 'firebase';

firebase.firebase.initializeApp(...);

没有检查.