Error InjectionToken AngularFire

Question

Hello i´m getting this error when run ng serve. I follow the angularFire documentation.

https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md

WARNING in ./~/angularfire2/angularfire2.js
3:26-40 "export 'InjectionToken' was not found in '@angular/core'

WARNING in ./~/angularfire2/app/firebase.app.module.js
3:40-54 "export 'InjectionToken' was not found in '@angular/core'

ERROR in /Users/sebastianalcoser/Documents/web/node_modules/angularfire2/app/firebase.app.module.d.ts (1,10): Module '"/Users/sebastianalcoser/Documents/web/node_modules/@angular/core/index"' has no exported member 'InjectionToken'.

ERROR in /Users/sebastianalcoser/Documents/web/node_modules/angularfire2/angularfire2.d.ts (3,10): Module '"/Users/sebastianalcoser/Documents/web/node_modules/@angular/core/index"' has no exported member 'InjectionToken'.

ERROR in Error encountered resolving symbol values statically. Reference to a local (non-exported) symbol 'firebaseConfig'. Consider exporting the symbol (position 14:5 in the original .ts file), resolving symbol AppModule in /Users/sebastianalcoser/Documents/web/src/app/app.module.ts

ERROR in multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
Module not found: Error: Can't resolve 'webpack-dev-server/client?http://localhost:4200' in '/Users/sebastianalcoser/Documents/web'
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

ERROR in multi ./src/styles.css
Module not found: Error: Can't resolve 'css-loader' in '/Users/sebastianalcoser/Documents/web'
 @ multi ./src/styles.css

ERROR in ./src/app/app.component.ts
Module not found: Error: Can't resolve 'css-loader' in '/Users/sebastianalcoser/Documents/web'
 @ ./src/app/app.component.ts 21:21-51
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

Answer 1

You need to install the latest version of angular:

On Linux/Mac: npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest typescript@latest --save On Windows: npm install @angular/common@latest @angular/compiler@latest @angular/compiler-cli@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest @angular/animations@latest typescript@latest --save

And probably you will need to update polyfill: npm install promise-polyfill --save-exact

Answer 2

To resolve this issue, try upgrading your node to the latest version 8.4 and also upgrade your angular/cli to the latest version, as shown bellow:

make sure you have latest version of angular-cli installed. To verify run the command ng -v and ensure you see angular-cli: 1.x.x-beta.xx. The lowest compatible version is 1.x.x-beta.14.

you may have the wrong cli version

npm uninstall -g angular-cli
npm uninstall -g @angular/cli
npm cache clean

reinstall clean version

npm install -g @angular/cli@latest

You need the Angular CLI, typings, and TypeScript.

npm install -g @angular/cli@latest

or install locally

npm install @angular/cli --save-dev

make sure you have typings installed

npm install -g typings
npm install -g typescript

I copied this from these this tutorial: