Ionic-framework: Building errors after upgrade to Ionic 3.9.2

[preselect]

Ionic version: (check one with "x")
(For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1)
[ ] 2.x
[ X ] 3.x
[ ] 4.x

I'm submitting a ... (check one with "x")
[ X ] bug report
[ ] feature request

Please do not submit support requests or "How to" questions here. Instead, please use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
After upgrading to Ionic 3.9.2 I get a bunch of errors when building my app:

Typescript Error
Module '"F:/Users/morit/Documents/Projects/ionic/foodji/node_modules/@angular/core/core"' has no exported member 'OpaqueToken'.
...ents/Projects/ionic/foodji/node_modules/@ionic/cloud-angular/dist/es5/index.d.ts
import { Observable } from 'rxjs';
import { ModuleWithProviders, OpaqueToken } from '@angular/core';
import { Auth as _Auth, FacebookAuth as _FacebookAuth, GoogleAuth as _GoogleAuth, Client as _Client, CloudSettings, Config as _Config, Database as _Database, Deploy as _Deploy, DIContainer as _DIContainer, IEventEmitter, IAuth, IClient, IConfig, IDeploy, IFacebookAuth, IGoogleAuth, IPush as _IPush, IPushMessage, IUser, Insights as _Insights, Push as _Push, User as _User } from '@ionic/cloud';

Typescript Error
Class 'Subject<T>' incorrectly extends base class 'Observable<T>'. Types of property 'lift' are incompatible. Type '<R>(operator: Operator<T, R>) => Observable<T>' is not assignable to type '<R>(operator: Operator<T, R>) => Observable<R>'. Type 'Observable<T>' is not assignable to type 'Observable<R>'. Type 'T' is not assignable to type 'R'.
...s/Projects/ionic/foodji/node_modules/ionic-native/node_modules/rxjs/Subject.d.ts
 */
export declare class Subject<T> extends Observable<T> implements ISubscription {
    observers: Observer<T>[];



md5-9973b1132e35730405f256d91ba7f3c9



Typescript Error
Class 'WebSocketSubject<T>' incorrectly extends base class 'AnonymousSubject<T>'. Types of property 'lift' are incompatible. Type '<R>(operator: Operator<T, R>) => WebSocketSubject<R>' is not assignable to type '<R>(operator: Operator<T, R>) => Observable<T>'. Type 'WebSocketSubject<R>' is not assignable to type 'Observable<T>'. Types of property 'operator' are incompatible. Type 'Operator<any, R>' is not assignable to type 'Operator<any, T>'. Type 'R' is not assignable to type 'T'.
...node_modules/ionic-native/node_modules/rxjs/observable/dom/WebSocketSubject.d.ts
 */
export declare class WebSocketSubject<T> extends AnonymousSubject<T> {
    url: string;



md5-95ebb303b2f7b74a1ed9c7864a6c60da



{
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "5.0.1",
    "@angular/compiler": "5.0.1",
    "@angular/compiler-cli": "5.0.1",
    "@angular/core": "5.0.1",
    "@angular/forms": "5.0.1",
    "@angular/http": "5.0.1",
    "@angular/platform-browser": "5.0.1",
    "@angular/platform-browser-dynamic": "5.0.1",
    "@ionic-native/app-version": "^4.4.0",
    "@ionic-native/barcode-scanner": "^4.4.0",
    "@ionic-native/core": "^4.4.0",
    "@ionic-native/diagnostic": "^4.4.0",
    "@ionic-native/facebook": "^4.4.0",
    "@ionic-native/firebase": "^4.4.0",
    "@ionic-native/geolocation": "^4.4.0",
    "@ionic-native/globalization": "^4.4.0",
    "@ionic-native/intercom": "^4.4.0",
    "@ionic-native/network": "^4.4.0",
    "@ionic-native/splash-screen": "^4.4.0",
    "@ionic-native/status-bar": "^4.4.0",
    "@ionic/app-scripts": "^3.1.0",
    "@ionic/cli-plugin-cordova": "^1.4.0",
    "@ionic/cli-plugin-ionic-angular": "^1.3.1",
    "@ionic/cloud-angular": "^0.12.0",
    "@ionic/storage": "^2.1.3",
    "@ngx-translate/core": "^8.0.0",
    "@ngx-translate/http-loader": "2.0.0",
    "@types/crypto-js": "^3.1.35",
    "@types/node": "^8.0.50",
    "angular-cc-library": "^1.1.0",
    "angular2-jwt": "^0.2.3",
    "angular2-text-mask": "^8.0.3",
    "angular2-uuid": "^1.1.1",
    "auth0-js": "^8.11.2",
    "cordova-android": "~6.4.0",
    "cordova-browser": "~5.0.1",
    "cordova-ios": "^4.5.3",
    "cordova-plugin-app-version": "^0.1.9",
    "cordova-plugin-compat": "^1.1.0",
    "cordova-plugin-console": "^1.0.7",
    "cordova-plugin-device": "^1.1.6",
    "cordova-plugin-facebook4": "^1.9.1",
    "cordova-plugin-fcm": "^2.1.2",
    "cordova-plugin-geolocation": "^2.4.3",
    "cordova-plugin-globalization": "^1.0.7",
    "cordova-plugin-inappbrowser": "~1.7.1",
    "cordova-plugin-intercom": "^4.1.0",
    "cordova-plugin-multidex": "^0.1.4",
    "cordova-plugin-network-information": "^1.3.3",
    "cordova-plugin-splashscreen": "~4.0.3",
    "cordova-plugin-statusbar": "^2.2.3",
    "cordova-plugin-whitelist": "^1.3.2",
    "cordova.plugins.diagnostic": "^3.7.1",
    "crypto-js": "^3.1.9-1",
    "iban": "0.0.8",
    "ionic-angular": "^3.9.2",
    "ionic-plugin-deploy": "^0.6.7",
    "ionic-plugin-keyboard": "~2.2.1",
    "ionicons": "3.0.0",
    "moment": "^2.18.1",
    "ng2-validation": "^4.2.0",
    "phonegap-plugin-barcodescanner": "^7.0.0",
    "raven-js": "^3.17.0",
    "rxjs": "5.5.2",
    "sw-toolbox": "^3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.1.0",
    "@types/auth0": "^3.0.0",
    "@types/crypto-js": "^3.1.33",
    "@types/iban": "^0.0.29",
    "@types/node": "^8.0.19",
    "typescript": "2.4.2"
  },
  "version": "7.0.1",
  "cordova": {
    "plugins": {
      "cordova-plugin-inappbrowser": {},
      "cordova-plugin-globalization": {},
      "cordova-plugin-console": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-whitelist": {},
      "ionic-plugin-keyboard": {},
      "cordova-plugin-geolocation": {
        "GEOLOCATION_USAGE_DESCRIPTION": " "
      },
      "phonegap-plugin-barcodescanner": {
        "CAMERA_USAGE_DESCRIPTION": " "
      },
      "ionic-plugin-deploy": {},
      "cordova-plugin-intercom": {},
      "cordova-plugin-facebook4": {},
      "cordova-plugin-app-version": {},
      "cordova.plugins.diagnostic": {},
      "cordova-plugin-multidex": {},
      "cordova-plugin-fcm": {}
    },
    "platforms": [
      "android",
      "browser",
      "ios"
    ]
  }
}



md5-95f960aa1972aec456dfb5ea9b7c3449



cli packages: (C:\Users\morit\AppData\Roaming\nvm\v6.9.5\node_modules)

    @ionic/cli-utils  : 1.18.0
    ionic (Ionic CLI) : 3.18.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.0
    Cordova Platforms  : android 6.3.0 browser 5.0.1 ios 4.5.2
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node : v6.9.5
    npm  : 4.3.0
    OS   : Windows 10

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : legacy

[JanMesaric]

Same issue here.

[yemenifree]

OpaqueToken deprecated in Angular 5 and ionic-cloud-angular use it

open issue on @ionic-team/ionic-cloud-angular

[adyba]

OpaqueToken is only one issue that would go wrong with your Ionic3,8/Angular 4.x code accidentally upgraded to 3.9x/Angular5.x there is much more. I strongly advice not to upgrade to Ionic3.9.x on your production sites/apps unless you have a spare week or so. There are hundreds boobytraps like totaly new i18n system, new rxjs, new form behavior, etc.
CLI MUST NOT offer upgrades that requires major overhaul of the whole project codebase!!!!

[Danite]

Downgrade Typescript to 2.4.0, worked for me

[aspoonemore]

Same issues here

[posixpascal]

Seconding this, typescript 2.4.0 works for me.

Looks like the issue is with ReactiveX and typescript default changes. See here https://github.com/ReactiveX/rxjs/issues/2726#issuecomment-313713212

[aspoonemore]

I tried typescript 2.4 before posting and it didn’t resolve the issues for me. It’s possible I didn’t clear out my node_modules before reverting so I’ll try again and report back.

[posixpascal]

I added typescript 2.4.0 as a devDependency and installed it (maybe you installed it globally?).

Also explicitly install 2.4.0 as 2.4.1 already introduced that config change that causes this specific error.

⁣

Am 28. Nov. 2017, 15:36, um 15:36, aspoonemore [e-mail] schrieb:

I tried typescript 2.4 before posting and it didn’t resolve the issues
for me. It’s possible I didn’t clear out my node_modules before
reverting so I’ll try again and report back.

--
You are receiving this because you commented.
Reply to this email directly or view it on GitHub:
https://github.com/ionic-team/ionic/issues/13385#issuecomment-347542201

[szurnet]

Same issue, downgrading to typescript 4.2.0 didn't help

[minusf]

downgrading has other issues

npm WARN @angular/[email protected] requires a peer of typescript@>=2.4.2 <2.5 but none was installed.
npm WARN [email protected] requires a peer of [email protected] but none was installed.

[aspoonemore]

I downgraded typescript to 2.4 and 2 of the errors are gone but I'm still seeing this one

Typescript Error
Module '"C:/dev/ionic/s2s/node_modules/@angular/core/core"' has no exported member 'OpaqueToken'.

[jlariza]

I tried downgrading typescript to 2.4.0 and it did not worked. I am still having the issue with OpaqueToken and cloud-angular.

Ty

[jlariza]

I am also getting "Cannot find module 'ionic-native'."

I have "@ionic-native/core": "^4.4.2", in my package.json

What am I missing? Ty

[joshgarwood]

Same issue here... how has the ionic team not addressed or replied to this yet?? The 3.9.2 release is totally busted because of this.

[Juliozen]

Same issue here, Opaque Token are deprecated and cand deploy in my android device, only in ionic server. Dont update to ionic 3.9.x if u use a i18n to translate... lets do it in angular 4 for now

[jcbowyer]

Is there a solution to this. I am still getting the opaquetoken error

[amrayoub]

same issue here

[jgerstle]

cloud-angular is deprecated so I assume the ionic team will not fix this. That being said removing cloud-angular fixes the issue.

[patelya22]

How can you remove the cloud-angular?

[selected-pixel-jameson]

I had to update the ngx-translate/core to the latest version to get around an issue with the opaqueToken module.

[jgerstle]

@patelya22 First remove cloud angular from your code. I had to remove references and code from both my app.module.ts and my app.component.ts and then remove it from your package.json or run npm remove @ionic/cloud-angular --save (maybe save-dev)

[paqogomez]

On angular 5.1.1, ionic 4.5.2 and ionic cloud angular 0.12.0 and am having this error.

Only fully removing, as suggested by @jgerstle, worked.

[dlaraf]

As @selected-pixel-jameson mentioned I had to update ngx-translate as well to the latest version(currently to 9.1.1), in the package.json:

        "@ngx-translate/core": "9.1.1",
        "@ngx-translate/http-loader": "2.0.1",

and update the translate loader from:

export function HttpLoaderFactory(http: http) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

to

export function HttpLoaderFactory(http: **HttpClient**) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

Imports;

import { HttpModule } from '@angular/http';
import {HttpClientModule, HttpClient} from '@angular/common/http';

and imports module section:

imports: [
    BrowserModule,
    HttpModule,
    HttpClientModule,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps: [HttpClient]
      }
    }), 
...

[jhonycage]

any advance on this matter?

[karansharma27]

Upgrading ionic storage to 2.1.3 worked for me..

[leohenrique]

Upgrading ionic storage to 2.1.3 worked for me too.

[ionitron-bot[bot]]

This issue has been automatically identified as an Ionic 3 issue. We recently moved Ionic 3 to its own repository. I am moving this issue to the repository for Ionic 3. Please track this issue over there.

If I've made a mistake, and if this issue is still relevant to Ionic 4, please let the Ionic Framework team know!

Thank you for using Ionic!

[ionitron-bot[bot]]

Issue moved to: https://github.com/ionic-team/ionic-v3/issues/524