将Firebase与Webpack和TypeScript一起使用

Question

I'm trying to pull some data from a Firebase instance, but am running into an issue when trying to bind it to a variable. I'm using TypeScript and Webpack to build.

main.ts

import * as Firebase from 'firebase';

class filter {
    constructor(){
        let ref = new Firebase('my-url-here');
    }
}

The typings and npm module are installed and working, and Visual Code brings up no errors, but when I hit the browser I get:

ERROR

TypeError: Firebase is not a constructor

..

Logging Firebase to the console returns an object with methods like auth , app and database , but none of these seem to work either (or I'm calling them incorrectly). Any ideas?

A general best practice on how to incorporate Firebase into a Webpack/TypeScript would be just as welcome.

Answer 1

In my project i had the same error: It was caused by the firebase.json file which i guess got picked up by webpack.

As i can only guess why it happened: Webpack creating a symbol "Firebase" which replaced the constructor of firebase itself.

Have you done a firebase init in your directory?

Also see : https://github.com/angular/angularfire2/issues/187