0

Environment:

OS: Linux Mint 18 Cinnamon 64-bit
NPM: 5.6.0
Node: v10.0.0
Ionic: 3.20.0

How I receive this error

I was following this tutorial to apply firebase to an ionic project using angularfire2. I follow the tutorial exactly until I receive an error while running

$ ionic serve

The full error is like this:

typescript: home/brian/node_modules/angularfire2/angularfire2.d.ts, line: 1 
Cannot find module '@angular/core'. 

L1:  import { InjectionToken, NgZone } from '@angular/core';
L2:  import { Observable, Subscription } from 'rxjs';

typescript: home/brian/node_modules/angularfire2/angularfire2.d.ts, line: 2 
Cannot find module 'rxjs'. 

L1:  import { InjectionToken, NgZone } from '@angular/core';
L2:  import { Observable, Subscription } from 'rxjs';
L3:  import { FirebaseOptions, FirebaseAppConfig } from '@firebase/app-types';

typescript: home/brian/node_modules/angularfire2/auth/auth.d.ts, line: 3 
Cannot find module '@angular/core'. 

L2:  import { FirebaseOptions, FirebaseAppConfig } from '@firebase/app-types';
L3:  import { NgZone } from '@angular/core';
L4:  import { Observable } from 'rxjs';

typescript: home/brian/node_modules/angularfire2/auth/auth.d.ts, line: 4 
Cannot find module 'rxjs'. 

L3:  import { NgZone } from '@angular/core';
L4:  import { Observable } from 'rxjs';
L5:  export declare class AngularFireAuth {

typescript: home/brian/node_modules/angularfire2/firebase.app.module.d.ts, line: 1 
Cannot find module '@angular/core'. 

L1:  import { InjectionToken } from '@angular/core';
L2:  import { FirebaseApp as _FirebaseApp, FirebaseOptions, FirebaseAppConfig } from '@firebase/app-types';

Traceback

Tracing back, when I was installing angularfire2 through command line, I run this command (following the documentation)

npm install firebase angularfire2 --save

And it returns this:

npm WARN registry Unexpected warning for https://registry.npmjs.org/: Miscellaneous Warning EAI_AGAIN: request to https://registry.npmjs.org/firebase failed, reason: getaddrinfo EAI_AGAIN registry.npmjs.org registry.npmjs.org:443
npm WARN registry Using stale package data from https://registry.npmjs.org/ due to a request error during revalidation.
npm WARN [email protected] requires a peer of @angular/common@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/platform-browser@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/platform-browser-dynamic@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @firebase/app@^0.1.6 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of rxjs@^5.5.4 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of zone.js@^0.8.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

+ [email protected]
+ [email protected]
updated 2 packages in 80.502s

Then I try to run the same command again, now it returns almost the same as above but without the npm WARN registry.

npm WARN [email protected] requires a peer of @angular/common@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/platform-browser@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/platform-browser-dynamic@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of rxjs@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of zone.js@^0.8.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

The file package.json is located in /home/brian and it contains the lines below.

{
  "name": "bin",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "angular": "^1.7.0",
    "angularfire2": "^5.0.0-rc.8.0",
    "cordova": "^8.0.0",
    "firebase": "^5.0.2",
    "ionic": "^3.20.0",
    "npm": "^6.0.1"
  }
}

There is this text in browser after i run $ ionic serve

Ionic Framework: 3.9.2
Ionic App Scripts: 3.1.9
Angular Core: 5.2.10
Angular Compiler CLI: 5.2.10
Node: 10.0.0
OS Platform: Linux 4.4
Navigator Platform: Linux x86_64
User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:57.0) Gecko/20100101 Firefox/57.0

I think I installed angularfire on the same location as npm and node, because I run all these installation command in my default location when opening command line. It should be in /home/brian. I also have this folder /home/brian/node_modules.

My Google research to solve this

This similar thread says that we need to rename @angular to @angular2, but I found it returns same error.

Does anyone ever experience the same issue? Any help would be appreciated.

6
  • what's you current version of angular? Commented May 15, 2018 at 1:39
  • can you include the package.json in your question? Commented May 15, 2018 at 6:37
  • Hi @SurajRao thanks for your suggestion. it is updated. Commented May 15, 2018 at 18:25
  • Hi @Pengyy according to the file package.json, the angular version is 1.7.0 . Is there any other way to check angular version? I cannot check using angular -v or angular --version . Commented May 15, 2018 at 18:26
  • angular 1.7? 6.* is released Commented May 15, 2018 at 18:48

2 Answers 2

4

Based on you version info of ionic v 3.9.2, you need to install angular V4.4.6, refer ionic dependencies. BTW, when you don't declare the exact version you want to install, npm will install the latest version by default.

You can use below command:

// all angular packages listed in above dependencies 
npm install @angular/[package-name]@4.4.6

And based on version of angular packages, you should install AngularFire2 **v5.0.0-rc.3** and rxjs of v5.0.1+(not v6.x).

npm install [email protected] [email protected] --save
npm install [email protected] --save
Sign up to request clarification or add additional context in comments.

8 Comments

Thanks for your response, I have ran: $ npm install firebase [email protected] --save, so my package.json now is "angularfire2": "^5.0.0-rc.3". However I still got the exact same error when running $ ionic serve. Any other idea?
@BrianIvanderT.P. same error means Cannot find module '@angular/core'. ? have you installed @angular/[email protected]?
Great catch @pengyy ! I run $ npm install @angular/[email protected] and $ npm install [email protected] --save , now that "Cannot find module" has gone. But I have another typescript error.
Class 'FirebaseApp' incorrectly implements interface 'App'. Property 'functions' is missing in type 'FirebaseApp'. home/brian/node_modules/angularfire2/firebase.app.module.d.ts
export declare const FirebaseAppConfigToken: InjectionToken<FirebaseAppConfig>; export declare class FirebaseApp implements firebase.app.App { name: string;
|
0

Thanks @Pengyy, your suggestion is really close to fix it, just need to add one more step.

This error is caused by the non compatible versions I used accross ionic - @angular/core - firebase - angularfire2 - and rxjs.

The way I solve it is is following @Pengyy's answer:

In my home folder /home/brianrun

  1. npm install @angular/[package-name]@4.4.6
  2. npm install [email protected] [email protected] --save
  3. npm install [email protected] --save

Then need to do one more step: in my ionic project folder where I run ionic serve, (e.g. project name is myApp the folder is /home/brian/myApp) run this command.

  1. npm install [email protected]

This last step is necessary, otherwise I still got an error

Runtime Error 
Cannot find module "firebase/auth"

This problem is solved!

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.