Module not found: Error: Can't resolve '@firebase/XXXX' in '~/node_modules/firebase/...' after Firebase 4.8.1

Version info

Angular: 5.1.1 Firebase: 4.8.1 AngularFire: 5.0.0-rc.4 Other (e.g. Ionic/Cordova, Node, browser, operating system): Other latest; OS: macOS latest when submitting

How to reproduce these conditions

npm start failed to compile Failing test unit, Plunkr, or JSFiddle demonstrating the problem

Steps to set up and reproduce

Sample data and security rules

<-- include/attach/link to some json sample data (or provide credentials to a sanitized, test Firebase project) -->

Debug output

** Errors in the JavaScript console **

Can’t resolve ‘@firebase/polyfill’ in … Can’t resolve ‘@firebase/firestore’ Can’t resolve ‘@firebase/database’ Can’t resolve ‘@firebase/auth’ Can’t resolve ‘@firebase/app’ in ‘/…/node_modules/firebase/XXXX’ @ ./node_modules/firebase/auth/index.js 17:0-25 @ ./node_modules/angularfire2/auth/auth.module.js @ ./node_modules/angularfire2/auth/public_api.js @ ./node_modules/angularfire2/auth/index.js @ ./src/app/app.module.ngfactory.js @ ./src/main.browser.ts @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/main.browser.ts

** Output from firebase.database().enableLogging(true); **

** Screenshots **

Expected behavior

Actual behavior

[zgosalvez]

Rolling back to "firebase": "4.8.0" “fixed” it for me.

[elron]

VS Code mistakenly put the wrong source path

// Possible wrong paths
import { AngularFirestore } from '@angular/fire/firestore/firestore';
import { AngularFirestoreDocument } from '@angular/fire/firestore/public_api';

// The right path
import { AngularFirestore, AngularFirestoreDocument } from '@angular/fire/firestore';`