title: Ionic 2 convert to Ionic 3 : "Error: Failed to transpile program" on "ionic build iOS"
body: <p>I've been working on setting an existing Ionic 2 project on a Apple Mac machine.</p>
  <p>I've duplicated my project as it is described <a href="https://github.com/driftyco/ionic/issues/2361#issuecomment-58474409" rel="nofollow noreferrer">here</a>.</p>
  <p>After solving some Xcode issues, finally the app opens on an iPhone iOS physical device but shows a blank screen after the splash screen.</p>
  <p>I found how to get some log displayed <a href="https://stackoverflow.com/questions/12571650/catching-all-javascript-unhandled-exceptions/16185951#16185951">here</a>. The log input lead me to that <a href="https://stackoverflow.com/questions/43583032/cannot-find-module-ionic-native">SO thread: &quot;cannot find module ionic-native&quot;</a>.</p>
  <p>I concluded that I had to update my project code to match the <a href="http://ionicframework.com/docs/native/" rel="nofollow noreferrer">new settings  to handle ionic-native plugins</a>.</p>
  <p>For each plugin I applied the following process: <code>ionic plugin rm [plugin name]</code>, <code>ionic plugin add [plugin name]</code>, <code>npm install --save @ionic-native/[plugin name]</code>.</p>
  <p>I reviewed my code to change where needed, in some <code>components</code> and <code>providers</code> from:
  <code>{ NativePlugin1, NativePlugin2 } from 'ionic-native';</code>
  To:
  <code>{ NativePlugin1 } from '@ionic-native/native-plugin-1';</code>
  <code>{ NativePlugin2 } from '@ionic-native/native-plugin-2';</code></p>
  <p>I modified my [ionic project folder]/src/app/app.module.ts and added:</p>
  <pre><code>// all declaration as it was like &quot;import { NgModule } from '@angular/core';&quot;
  //plus declarations added to match new rules and add plugin in providers section
  { NativePlugin1 } from '@ionic-native/native-plugin-1';
  { NativePlugin2 } from '@ionic-native/native-plugin-2';
  @NgModule({
    declarations: [
      ...
    ],
    imports: [...
    ],
    bootstrap: [IonicApp],
    entryComponents: [...
    ],
    providers: [
      NativePlugin1,
      NativePlugin2,
      ...
    ]
  })
  export class AppModule {}
  </code></pre>
  <p>I deleted from my package.json the line <code>&quot;ionic-native&quot;: &quot;^2.7.0&quot;,</code> as it is suggested in the <a href="http://ionicframework.com/docs/native/" rel="nofollow noreferrer">solution of the SO thread I am referencing to</a>:</p>
  <blockquote>
  <p>You need to remove  &quot;ionic-native&quot;: &quot;^3.5.0&quot; from your package.json and after that run npm i.</p>
  </blockquote>
  <p>Then I launched in that order: <code>sudo npm cache clear</code>, <code>sudo npm install</code>, and finally <code>ionic build ios</code>, for which I get:</p>
  <blockquote>
  <p>&quot;Error: Failed to transpile program&quot;</p>
  </blockquote>
  <p>And above this error I see plenty of errors related to the <code>ionic-native</code> like this one:</p>
  <blockquote>
  <p>[14:22:15]  typescript: src/services/custom-http/custom-http.ts, line:XX</p>
  <pre><code>       Property 'type' does not exist on type 'typeof Network'.
  
   LXX:     return Network.type;
  </code></pre>
  </blockquote>
  <p><strong>I feel stuck now so if anyone has a hint it  would be welcome.</strong></p>
  <p><strong>To complete here are some additional info:</strong>
  <code>ionic info</code> gives:</p>
  <pre><code>Cordova CLI: 6.5.0 
  Ionic Framework Version: 2.0.0-rc.0
  Ionic CLI Version: 2.2.3
  Ionic App Lib Version: 2.2.1
  Ionic App Scripts Version: 1.3.4
  ios-deploy version: 1.9.1 
  ios-sim version: 5.0.13 
  OS: macOS Sierra
  Node Version: v6.9.1
  Xcode version: Xcode 7.3.1 Build version 7D1014
  </code></pre>
  <p>And my <code>package.json</code> is like this:</p>
  <pre><code>{
    &quot;name&quot;: &quot;my project&quot;,
    &quot;author&quot;: &quot;my name&quot;,
    &quot;homepage&quot;: &quot;&quot;,
    &quot;private&quot;: true,
    &quot;scripts&quot;: {
      &quot;build&quot;: &quot;ionic-app-scripts build&quot;,
      &quot;watch&quot;: &quot;ionic-app-scripts watch&quot;,
      &quot;serve:before&quot;: &quot;watch&quot;,
      &quot;emulate:before&quot;: &quot;build&quot;,
      &quot;deploy:before&quot;: &quot;build&quot;,
      &quot;build:before&quot;: &quot;build&quot;,
      &quot;run:before&quot;: &quot;build&quot;
    },
    &quot;dependencies&quot;: {
      &quot;@angular/common&quot;: &quot;2.0.0&quot;,
      &quot;@angular/compiler&quot;: &quot;2.0.0&quot;,
      &quot;@angular/compiler-cli&quot;: &quot;0.6.2&quot;,
      &quot;@angular/core&quot;: &quot;2.0.0&quot;,
      &quot;@angular/forms&quot;: &quot;2.0.0&quot;,
      &quot;@angular/http&quot;: &quot;2.0.0&quot;,
      &quot;@angular/platform-browser&quot;: &quot;2.0.0&quot;,
      &quot;@angular/platform-browser-dynamic&quot;: &quot;2.0.0&quot;,
      &quot;@angular/platform-server&quot;: &quot;2.0.0&quot;,
      &quot;@ionic-native/core&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/device&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/insomnia&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/keyboard&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/network&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/screen-orientation&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/splash-screen&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/sqlite&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/status-bar&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/vibration&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic/storage&quot;: &quot;1.0.3&quot;,
      &quot;ionic-angular&quot;: &quot;2.0.0-rc.0&quot;,
      &quot;ionicons&quot;: &quot;3.0.0&quot;,
      &quot;ng2-translate&quot;: &quot;^3.2.1&quot;,
      &quot;rxjs&quot;: &quot;5.0.0-beta.12&quot;,
      &quot;zone.js&quot;: &quot;0.6.21&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@ionic/app-scripts&quot;: &quot;latest&quot;,
      &quot;typescript&quot;: &quot;2.0.3&quot;
    },
    &quot;description&quot;: &quot;MyProject: An Ionic project&quot;,
    &quot;cordovaPlugins&quot;: [
      &quot;cordova-plugin-device&quot;,
      &quot;cordova-plugin-console&quot;,
      &quot;cordova-plugin-whitelist&quot;,
      &quot;cordova-plugin-splashscreen&quot;,
      &quot;cordova-plugin-statusbar&quot;,
      &quot;ionic-plugin-keyboard&quot;
    ],
    &quot;cordovaPlatforms&quot;: []
  }
  </code></pre>
  <p><strong>Some update after @suraj input:</strong>
  I ve updated my package.json such as:</p>
  <pre><code>{
    &quot;name&quot;: &quot;MyIonicProject&quot;,
    &quot;author&quot;: &quot;author name&quot;,
    &quot;homepage&quot;: &quot;&quot;,
    &quot;private&quot;: true,
    &quot;scripts&quot;: {
      &quot;build&quot;: &quot;ionic-app-scripts build&quot;,
      &quot;watch&quot;: &quot;ionic-app-scripts watch&quot;,
      &quot;serve:before&quot;: &quot;watch&quot;,
      &quot;emulate:before&quot;: &quot;build&quot;,
      &quot;deploy:before&quot;: &quot;build&quot;,
      &quot;build:before&quot;: &quot;build&quot;,
      &quot;run:before&quot;: &quot;build&quot;
    },
    &quot;dependencies&quot;: {
      &quot;@angular/common&quot;: &quot;4.0.0&quot;,
      &quot;@angular/compiler&quot;: &quot;4.0.0&quot;,
      &quot;@angular/compiler-cli&quot;: &quot;4.0.0&quot;,
      &quot;@angular/core&quot;: &quot;4.0.0&quot;,
      &quot;@angular/forms&quot;: &quot;4.0.0&quot;,
      &quot;@angular/http&quot;: &quot;4.0.0&quot;,
      &quot;@angular/platform-browser&quot;: &quot;4.0.0&quot;,
      &quot;@angular/platform-browser-dynamic&quot;: &quot;4.0.0&quot;,
      &quot;@angular/platform-server&quot;: &quot;4.0.0&quot;,
      &quot;@ionic-native/core&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/device&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/insomnia&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/keyboard&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/network&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/screen-orientation&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/splash-screen&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/sqlite&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/status-bar&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic-native/vibration&quot;: &quot;^3.5.0&quot;,
      &quot;@ionic/storage&quot;: &quot;2.0.1&quot;,
      &quot;ionic-angular&quot;: &quot;3.0.1&quot;,
      &quot;ionicons&quot;: &quot;3.0.0&quot;,
      &quot;rxjs&quot;: &quot;5.1.1&quot;,
      &quot;sw-toolbox&quot;: &quot;3.4.0&quot;,
      &quot;zone.js&quot;: &quot;^0.8.4&quot;,
      &quot;ng2-translate&quot;: &quot;^3.2.1&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@ionic/app-scripts&quot;: &quot;latest&quot;,
      &quot;typescript&quot;: &quot;~2.2.1&quot;
    },
    &quot;description&quot;: &quot;LpjcaIonic: An Ionic project&quot;,
    &quot;cordovaPlugins&quot;: [
      &quot;cordova-plugin-device&quot;,
      &quot;cordova-plugin-console&quot;,
      &quot;cordova-plugin-whitelist&quot;,
      &quot;cordova-plugin-splashscreen&quot;,
      &quot;cordova-plugin-statusbar&quot;,
      &quot;ionic-plugin-keyboard&quot;
    ],
    &quot;cordovaPlatforms&quot;: []
  }
  </code></pre>
  <p>I followed the <a href="https://github.com/driftyco/ionic/blob/master/CHANGELOG.md#300-2017-04-05" rel="nofollow noreferrer">change log update for ionic 3</a>.</p>
  <p>I deleted the <code>node_modules</code> directory of my project launching:<code>sudo rm -rf node_modules/</code> then did an <code>nom install</code> , <code>ionic platform rm ios</code>,<code>ionic platform add ios</code>, and finally  <code>ionic build ios</code>.</p>
  <p>I looked in the log, here is their content:</p>
  <pre><code>0 info it worked if it ends with ok
  1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'build' ]
  2 info using npm@4.5.0
  3 info using node@v6.9.1
  4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
  5 info lifecycle [MyIonicProject]@~prebuild: [MyIonicProject]@
  6 silly lifecycle [MyIonicProject]@~prebuild: no script for prebuild, continuing
  7 info lifecycle [MyIonicProject]@~build: [MyIonicProject]@
  8 verbose lifecycle [MyIonicProject]@~build: unsafe-perm in lifecycle true
  9 verbose lifecycle [MyIonicProject]@~build: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/my_mac/Documents/[MyIonicProject]/node_modules/.bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin:/Users/my_mac/Library/Android/sdk:/Users/my_mac/Library/Android/sdk/tools:/Users/my_mac/Library/Android/sdk/platform-tools
  10 verbose lifecycle [MyIonicProject]@~build: CWD: /Users/my_mac/Documents/[MyIonicProject]
  11 silly lifecycle [MyIonicProject]@~build: Args: [ '-c', 'ionic-app-scripts build' ]
  12 silly lifecycle [MyIonicProject]@~build: Returned: code: 1  signal: null
  13 info lifecycle [MyIonicProject]@~build: Failed to exec build script
  14 verbose stack Error: [MyIonicProject]@ build: `ionic-app-scripts build`
  14 verbose stack Exit status 1
  14 verbose stack     at EventEmitter.&lt;anonymous&gt; (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:279:16)
  14 verbose stack     at emitTwo (events.js:106:13)
  14 verbose stack     at EventEmitter.emit (events.js:191:7)
  14 verbose stack     at ChildProcess.&lt;anonymous&gt; (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
  14 verbose stack     at emitTwo (events.js:106:13)
  14 verbose stack     at ChildProcess.emit (events.js:191:7)
  14 verbose stack     at maybeClose (internal/child_process.js:877:16)
  14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
  15 verbose pkgid LpjcaIonic@
  16 verbose cwd /Users/my_mac/Documents/[MyIonicProject]
  17 verbose Darwin 16.5.0
  18 verbose argv &quot;/usr/local/bin/node&quot; &quot;/usr/local/bin/npm&quot; &quot;run&quot; &quot;build&quot;
  19 verbose node v6.9.1
  20 verbose npm  v4.5.0
  21 error code ELIFECYCLE
  22 error errno 1
  23 error LpjcaIonic@ build: `ionic-app-scripts build`
  23 error Exit status 1
  24 error Failed at the [MyIonicProject]@ build script 'ionic-app-scripts build'.
  24 error Make sure you have the latest version of node.js and npm installed.
  24 error If you do, this is most likely a problem with the [MyIonicProject] package,
  24 error not with npm itself.
  24 error Tell the author that this fails on your system:
  24 error     ionic-app-scripts build
  24 error You can get information on how to open an issue for this project with:
  24 error     npm bugs [MyIonicProject]
  24 error Or if that isn't available, you can get their info via:
  24 error     npm owner ls [MyIonicProject]
  24 error There is likely additional logging output above.
  25 verbose exit [ 1, true ]
  </code></pre>
  <p>Additional input to @suraj, the class <code>CustomHttpService</code>, it is a service located in <code>[project]/services/custom-http/custom-http.ts</code> and injected in the <code>Providers</code> section of <code>app.module.ts</code>:</p>
  <pre><code>import { Injectable } from '@angular/core';
  import { Http, Headers, Response, RequestOptions, RequestMethod, Request } from '@angular/http';
  import { Observable } from 'rxjs/Observable';
  // import { Network } from 'ionic-native';
  import { Network } from '@ionic-native/network';
  
  
  @Injectable()
  export class CustomHttpService {
      //other code    
  
      public connection = () =&gt; {
          return Network.type;
      }
  
  
      public onDisconnect = ():Observable&lt;any&gt; =&gt; {
          return Network.onDisconnect();
      }
  
      public onConnect = ():Observable&lt;any&gt; =&gt; {
          return Network.onConnect();
      }   
  
  }
  </code></pre>