angularfire: Error with "ng build && ng serve" following "Installation and Setup" guide

I followed the steps from the installation guide but I receive the below errors:

Build error
The Broccoli Plugin: [BroccoliTypeScriptCompiler] failed with:
SyntaxError: Unexpected token ]
    at Object.parse (native)
    at BroccoliTypeScriptCompiler._loadTsConfig (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\broccoli-typescript.js:128:25)
    at BroccoliTypeScriptCompiler._createServiceHost (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\broccoli-typescript.js:163:25)
    at BroccoliTypeScriptCompiler.build (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\broccoli-typescript.js:41:12)
    at C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\broccoli-caching-writer\index.js:152:21
    at lib$rsvp$$internal$$tryCatch (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1048:17)
    at lib$rsvp$$internal$$publish (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1019:11)
    at lib$rsvp$asap$$flush (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1198:9)
    at nextTickCallbackWith0Args (node.js:420:9)
    at process._tickCallback (node.js:349:13)

The broccoli plugin was instantiated at: 
    at BroccoliTypeScriptCompiler.Plugin (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\broccoli-plugin\index.js:10:31)
    at BroccoliTypeScriptCompiler.CachingWriter [as constructor] (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\broccoli-caching-writer\index.js:21:10)
    at BroccoliTypeScriptCompiler (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\broccoli-typescript.js:27:10)
    at Angular2App._getTsTree (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\angular2-app.js:331:18)
    at Angular2App._buildTree (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\angular2-app.js:124:23)
    at new Angular2App (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\lib\broccoli\angular2-app.js:53:23)
    at module.exports (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\angular-cli-build.js:10:10)
    at Class.module.exports.Task.extend.setupBroccoliBuilder (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\ember-cli\lib\models\builder.js:55:19)
    at Class.module.exports.Task.extend.init (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\ember-cli\lib\models\builder.js:89:10)
    at new Class (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\core-object\core-object.js:18:12)
    at Class.module.exports.Task.extend.run (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\ember-cli\lib\tasks\serve.js:15:19)
    at C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\ember-cli\lib\commands\serve.js:64:24
    at lib$rsvp$$internal$$tryCatch (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1048:17)
    at lib$rsvp$$internal$$publish (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1019:11)
    at lib$rsvp$asap$$flush (C:\Users\Marian\Desktop\ng_cli\test_cli_fire\node_modules\angular-cli\node_modules\rsvp\dist\rsvp.js:1198:9)

Files:

src\main.ts

import { BrowserModule } from '@angular/platform-browser';
import { enableProdMode, NgModule } from '@angular/core';
import { <MyApp>, environment } from './app/';
import { AngularFireModule } from '/angularfire2';

const firebaseConfig = {
  apiKey: "AIzaSyBofqdUZR8WLKdPsqryQtF1lFxNAdk6JEI",
  authDomain: "vital-contact-116013.firebaseapp.com",
  databaseURL: "https://vital-contact-116013.firebaseio.com",
  storageBucket: "<your-storage-bucket>"
}

@NgModule({
  imports: [
    BrowserModule,
    AngularFireModule.initializeApp(firebaseConfig)
  ],
  declarations: [ MyComponent ],
  Bootstrap: [ MyComponent ]
})
export class MyAppModule {}

src\app\app.component.ts

import { Component } from '@angular/core';
import { AngularFire, FirebaseListObservable } from 'angularfire2';

@Component({
  moduleId: module.id,
  selector: '<my-app>-app',
  templateUrl: '<my-app>.component.html',
  styleUrls: ['<my-app>.component.css']
})
export class <MyApp>Component {
  items: FirebaseListObservable<any[]>;
  constructor(af: AngularFire) {
    this.items = af.database.list('items');
  }
}

src\tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "mapRoot": "/",
    "module": "commonjs",
    "moduleResolution": "node",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "outDir": "../dist/",
    "rootDir": ".",
    "sourceMap": true,
    "target": "es5",
    "inlineSources": true
  },

  "files": [
    "main.ts",
    "typings.d.ts",
    "node_modules/angularfire2/firebase3.d.ts",
  ]
}

typings.json

{
  "globalDevDependencies": {
    "angular-protractor": "registry:dt/angular-protractor#1.5.0+20160425143459",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "selenium-webdriver": "registry:dt/selenium-webdriver#2.44.0+20160317120654"
  },
  "globalDependencies": {
    "es6-shim": "registry:dt/es6-shim#0.31.2+20160602141504",
    "firebase3": "file:node_modules/angularfire2/firebase3.d.ts"
  },
  "dependencies": {
    "es6-promise": "registry:npm/es6-promise#3.0.0+20160723033700"
  }
}

I also tried the path shown here: https://www.youtube.com/watch?v=8E-dueHCd2o but without success

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 38 (10 by maintainers)

Commits related to this issue

Finally works, without errors :D Thank you all: https://github.com/angular/angularfire2/issues/461 — committed to sorcamarian/angularfire2-instalation-webpack-fixed-errors by sorcamarian 8 years ago
Finally works, without errors :D Thank you all: https://github.com/angular/angularfire2/issues/461 — committed to sorcamarian/angularfire2-instalation-webpack-fixed-errors by sorcamarian 8 years ago
Finally works, without errors :D Thank you all: https://github.com/angular/angularfire2/issues/461 — committed to sorcamarian/angularfire2-instalation-webpack-fixed-errors by sorcamarian 8 years ago
Finally works, without errors :D Thank you all: https://github.com/angular/angularfire2/issues/461 — committed to sorcamarian/angularfire2-instalation-webpack-fixed-errors by sorcamarian 8 years ago
angularFire installed Followed install instructions from https://github.com/angular/angularfire2 but getting errors on firebase namespace as per https://github.com/angular/angularfire2/issues/461 — committed to ashmccallum/home-move-tool by deleted user 8 years ago

Most upvoted comments

Hi @dmastag, I tried the following steps in my machine running os: win32 x64, node: 4.4.7 for using Angular Fire beta4 version. And these steps were successful. 1. Installing Angular-cli fresh: https://github.com/angular/angular-cli/blob/master/WEBPACK_UPDATE.md npm unlink angular-cli npm rm -g angular-cli npm cache clean npm install --global angular-cli@webpack ->[1.0.0-beta.11-webpack.2] ng new projectName

2. Installing AngularFire Beta 4: npm install firebase angularfire2@next --save In package.json change 2.0.0-beta.3-pre2 to 2.0.0-beta.4 And run npm install again

3.In App.module.ts file import {AngularFireModule} from ‘angularfire2’; import * as firebase from ‘firebase’; const firebaseConfig = { apiKey: “YourKey”, authDomain: “YourDomain”, databaseURL: “YourURL”, storageBucket: “Your Bucket” } Inside NgModule Imports section, add-> AngularFireModule.initializeApp(firebaseConfig)

4. In App.component.ts import { AngularFire, FirebaseListObservable } from ‘angularfire2’; Inside AppComponent section, add-> items: FirebaseListObservable any[];//add brackets constructor(af: AngularFire) { this.items = af.database.list(‘/items’); } 5. Log into Firebase console Change the rules to read Add some sample data under items.

6. In App.component.html

ul li class=“text” *ngFor=“let item of items | async” {{item.$value}} /li /ul

7. command line npm install -g firebase-tools Firebase init, Select the firebase project created in the Firebase console Create a database rules json file, press enter Public directory is dist Configure as a single page app - N dist/index.html overwrite - N delete dist folder ng build Firebase serve. Firebase deploy -m “comments" Firebase open

gmanojisaac on Aug 30, 2016

It works for me when I added the “firebase” on “types” section of tsconfig.json

"types": [
   "jasmine",
   "firebase"
]

Do not need to upgrade to typescript@2.0.0, I’m using 1.8.10.

Is this a good solution?

Thanks!

paulogr on Aug 26, 2016

I have the same error.

GitHubish on Aug 23, 2016

With webpack it’s more simple to install, but unfortunately I still receive some errors.
Argument of type '{ imports: (typeof BrowserModule | ModuleWithProviders)[]; declarations: typeof AppComponent[]; B...' is not assignable to parameter of type 'NgModuleMetadataType'.at line 24 col 3
client:47 [WDS] Errors while compiling. client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\angularfire2.d.ts:13:65 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\angularfire2.d.ts:15:45 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth.d.ts:14:39 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth.d.ts:15:51 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth.d.ts:15:91 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth.d.ts:16:50 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth.d.ts:16:118 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth.d.ts:19:55 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:6:81 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:8:48 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:13:45 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:39:10 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:41:13 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:42:13 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:43:14 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:44:15 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:47:54 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\auth_backend.d.ts:47:84 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\firebase_sdk_auth_backend.d.ts:8:13 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\firebase_sdk_auth_backend.d.ts:9:24 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\firebase_sdk_auth_backend.d.ts:17:72 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\firebase_sdk_auth_backend.d.ts:19:35 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\auth\firebase_sdk_auth_backend.d.ts:20:36 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\database.d.ts:8:28 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\database.d.ts:9:30 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_factory.d.ts:5:73 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_factory.d.ts:5:103 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:6:49 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:6:79 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:8:10 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:8:40 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:9:22 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:9:52 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:11:20 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:12:52 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:13:38 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_list_observable.d.ts:14:82 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_object_factory.d.ts:4:75 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_object_observable.d.ts:7:101 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_object_observable.d.ts:9:21 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_object_observable.d.ts:10:27 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\database\firebase_object_observable.d.ts:11:14 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\interfaces.d.ts:9:22 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\interfaces.d.ts:10:25 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\interfaces.d.ts:11:25 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\node_modules\angularfire2\interfaces.d.ts:12:34 Cannot find namespace 'firebase'.errors @ client:49sock.onmessage @ client:83EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:274SockJS._transportMessage @ main.js:272EventEmitter.emit @ emitter.js:50WebSocketTransport.ws.onmessage @ websocket.js:35wrapFn @ zone.js:769ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256ZoneTask.invoke @ zone.js:423 client:49 [default] C:\Users\Marian\Desktop\ng_cli\ng_fire_webpack\src\main.ts:24:2 Argument of type '{ imports: (typeof BrowserModule | ModuleWithProviders)[]; declarations: typeof AppComponent[]; B...' is not assignable to parameter of type 'NgModuleMetadataType'. Object literal may only specify known properties, and 'Bootstrap' does not exist in type 'NgModuleMetadataType'.

sorcamarian on Aug 22, 2016

I created a repository: https://github.com/sorcamarian/angularfire2-instalation-webpack-fixed-errors

Thank you all!

@gmanojisaac, your instructions were the most appropriate for me.(without point 7)

sorcamarian on Aug 31, 2016

@GitHubish The experimental thing is something i have a fix for here: http://stackoverflow.com/questions/31737677/vscode-is-it-possible-to-supress-experimental-decorator-warnings/38970591#38970591

Hojou on Aug 26, 2016

Thank-you for your prompt response. I am still looking but for the moment I do not understand. In fact , I have the impression that strangely tsconfig.json is ignored.

Here are my deposit : https://github.com/GitHubish/angularfire2-test-webpack (all is ok - repo removed)

Reminder I have a mistake with the definition firebase not found : error in the chrome console in the IDE (VS Code) and in the console at the ng build)

Furthermore I have the error "

[ts]
Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

on app.module.ts and app.component.ts . Strange

Thanks

GitHubish on Aug 30, 2016

@GitHubish Can you publish your project to Github for me to take a look at? You have the correct versions installed.

davideast on Aug 26, 2016

I have successfully run my test project. I have not yet been fully identified when it crashes I try to make you a return tomorrow. However, when I run still only one error in the command line are:

ERROR in [default] Cannot find type definition file for 'firebase'.

but it is not blocking .

If I can still help before leaving, I recreated a basic project being careful this time to install angularfire2 beta4 and not through angularfire2@next (which may be the problem ? ) . Then my config my main.ts and my app.module.ts was not totally fair I think. Here are my 2 files.

main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { AppModule, environment } from './app/';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ApplicationRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import * as firebase from 'firebase';
import { AngularFireModule } from 'angularfire2';

// Must export the config
const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  databaseURL: "",
  storageBucket: ""
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    CommonModule,
    FormsModule,
    AngularFireModule.initializeApp(firebaseConfig)
  ],
  providers: [],
  entryComponents: [AppComponent],
  bootstrap: [AppComponent]
})
export class AppModule {

}

thanks

GitHubish on Aug 25, 2016

After updated typescript in the latest version ie 2.1.0 (I was version 2.0 before ), I have a multitude of typescript error.

Example: ...\node_modules\@angular\core\src\metadata\view.d.ts:129:21 Cannot find name 'Array'. ...\node_modules\@types\jasmine\index.d.ts:301:82 Cannot find name 'RegExp'. ...\node_modules\angularfire2\auth\auth.d.ts:16:118 Cannot find namespace 'firebase'. ...\node_modules\rxjs\operator\merge.d.ts:49:52 Cannot find name 'Array'.

And: .../node_modules/typescript/lib/lib.es2015.core.d.ts' not found. .../node_modules/typescript/lib/lib.es2015.collection.d.ts' not found. .../node_modules/typescript/lib/lib.es5.d.ts' not found.

GitHubish on Aug 24, 2016

@sorcamarian @GitHubish The problem is that you’re likely not on TypeScript 2.0+.

I cloned @sorcamarian’s repo and after fixing the syntax errors in typings.json I was able to ng serve without any errors. You also are omitting the bootstrap from your main.ts. You need to include the kickoff at the end of the file:

platformBrowserDynamic().bootstrapModule(MyAppModule);

Please upgrade to TypeScript 2.0 locally and globally to be safe, and try again.

npm install -g typescript@next
npm install typescript@next --save-dev

davideast on Aug 23, 2016

@sorcamarian @GitHubish You need to remove firebase3 from your globalDependencies in your tsconfig.json.

Check out @ericjim’s solution: https://github.com/angular/angularfire2/issues/414#issuecomment-241588890

davideast on Aug 23, 2016

Sorry there was a typo in the docs, it’s actually a lowercase bootstrap not an uppercase one.

Try again and let me know what happens.

davideast on Aug 22, 2016

There was a mismatch on the docs.

Can you check out our quickstart now and see if that helps? Basically you’ll need to make sure you’re on beta4 on AngularFire2 and remove the firebase3 typings.

davideast on Aug 22, 2016