IONIC 2 - Runtime Error. Cannot find module “ionic-native”

Question

I'm receiving this error while executing ionic 2 :

Error

Runtime Error. Cannot find module “ionic-native”.

Stack

g@localhost:8100/build/polyfills.js:3:7138 localhost:8100/build/main.js:113219:16 webpack_require@localhost:8100/build/main.js:20:34 localhost:8100/build/main.js:87074:92 webpack_require@localhost:8100/build/main.js:20:34 localhost:8100/build/main.js:135215:89 webpack_require@localhost:8100/build/main.js:20:34 localhost:8100/build/main.js:66:37 global code@localhost:8100/build/main.js:67:12

Answer 1

Issue may be because of ionic package up-gradation. Delete node_modules folder.

The ionic packages are changed from ionic 2.x to 3.x. You need to do following changes.

1. Delete reference of ionic-native from package.json.
   
   
2. Install ionic 3.x native packages using following commands

npm install @ionic-native/core --save

npm install @ionic-native/splash-screen --save

npm install @ionic-native/@ionic-native/status-bar --save

3. Change references of ionic 2.x native package from app.module.ts.

import { SplashScreen } from '@ionic-native/splash-screen';

import {StatusBar } from '@ionic-native/status-bar';

4. Add StatusBar and SplashScreen in providers array of app.module.ts
   

5. Update imports of StatusBar and SplashScreen in app.component.ts ( Just like step no. 3)

6. Add following in constructor of app.component.ts

statusBar: StatusBar, splashScreen: SplashScreen

7. If you are using http service, import it in app.module.ts as below:

import { HttpModule } from '@angular/http';

Add HttpModule in imports array.

Note: You may need to do same thing for the other similar native packages.

Answer 2

I solved that error changing this:

import { NavController } from 'ionic-angular/umd'

to this:

import { NavController } from 'ionic-angular'

Answer 3

Run the following command to install Ionic Native in your project:

npm install @ionic-native --save

Answer 4

Install below

npm install ionic-native --save