How to use angular 6 in ionic 3?

Question

I have an Ionic 3 app on Angular 5.2. I am trying to update to angular 6. I followed the upgrade guide already for the HttpClient and NgModule . The problem I have now is with the ionic-native .

I installed ionic-native V5 which is using rxjs v6 (required by angular6 and incompatible with previous versions).

Here is my app.module.ts file

import { Device } from '@ionic-native/device/ngx';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'
import { BrowserModule } from '@angular/platform-browser'
import { HttpClientModule } from '@angular/common/http'

@NgModule({
  declarations: [
    MyApp,
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot(),
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    Device
  ]
})
export class AppModule { }

I am getting multiple errors

Cannot find name 'Device'

Argument of type '{ declarations: (typeof MyApp)[]; imports: (ModuleWithProviders | typeof HttpClientModule | typeo...' is not assignable to parameter of type 'NgModule'. Types of property 'providers' are incompatible. Type '(DeviceOriginal ' is not assignable to type 'Provider[]'. Type 'DeviceOriginal' is not assignable to type 'Provider'. Type 'DeviceOriginal' is not assignable to type 'Provider'. Type 'DeviceOriginal' is not assignable to type 'ClassProvider'. Property 'provide' is missing in type 'DeviceOriginal'.

The question is: Can ionic 3 work with angular 6 already?

Answer 1

So far, the only thing worked for me was keeping ionic-native to version 4.10.0 and also installed rxjs-compat .

I think it is too early to move further. Here is the package.json

"dependencies": {
    "@angular/common": ">=6.0.9",
    "@angular/compiler": ">=6.0.9",
    "@angular/compiler-cli": ">=6.0.9",
    "@angular/core": ">=6.0.9",
    "@angular/forms": ">=6.0.9",
    "@angular/http": ">=6.0.9",
    "@angular/platform-browser": ">=6.0.9",
    "@angular/platform-browser-dynamic": ">=6.0.9",
    "@angular/pwa": ">=0.6.8",
    "@angular/service-worker": ">=6.0.9",
    "@ionic-native/core": ">=4.10.0",
    "ionic-angular": ">=3.9.2",
    "purify-css": ">=1.2.5",
    "rxjs": "^6.2.2",
    "rxjs-compat": ">=6.2.2",
    "zone.js": ">=0.8.26"
  }

Answer 2

Like a post on the Ionic forums suggests, Ionic 3.x is not tested with Angular 6.x and therefore not officially supported.

https://forum.ionicframework.com/t/upgrading-to-angular-6/131121/5

Better to wait and update to Ionic 4.x in my opinion.