Error in Upgrading to V3: Type 'IterableDiffer' is not generic

Ionic Framework ionic-v3
1

I’ve been trying to upgrade my project from Ionic 2 to Ionic 3 and I have been unable to shake this error:

[11:22:15] typescript: node_modules/ionic-angular/components/virtual-scroll/virtual-scroll.d.ts, line: 220
Type ‘IterableDiffer’ is not generic.

 L219:  private _dom;
 L220:  _differ: IterableDiffer<any>;
 L221:  _scrollSub: any;

I’ve seen that this error gets thrown when the typescript is updated to latest, among a slew of others. I’ve been around the block a couple times with that. I can’t tell if this is something that I’m doing wrong or if there’s a bug in the virtual scroll file (my guess is that if it were a bug, it would have been found way before this).

Here are the dependencies and devDependencies as they show up in my package.json.

"dependencies": {
        "@agm/core": "^1.0.0-beta.0",
        "@angular/common": "4.1.3",
        "@angular/compiler": "4.1.3",
        "@angular/compiler-cli": "4.1.3",
        "@angular/core": "4.1.3",
        "@angular/forms": "4.1.3",
        "@angular/http": "4.1.3",
        "@angular/platform-browser": "4.1.3",
        "@angular/platform-browser-dynamic": "4.1.3",
        "@angular/platform-server": "4.1.3",
        "@ionic-native/background-geolocation": "^3.12.1",
        "@ionic-native/core": "3.12.1",
        "@ionic-native/deeplinks": "3.12.1",
        "@ionic-native/facebook": "3.12.1",
        "@ionic-native/geolocation": "3.12.1",
        "@ionic-native/image-picker": "3.12.1",
        "@ionic-native/in-app-browser": "3.12.1",
        "@ionic-native/splash-screen": "3.12.1",
        "@ionic-native/sqlite": "3.12.1",
        "@ionic-native/status-bar": "3.12.1",
        "@ionic/storage": "2.0.1",
        "angular2-universal": "^2.1.0-rc.1",
        "body-parser": "^1.16.0",
        "braintree-web": "^3.12.1",
        "c3": "^0.4.11",
        "cordova-ios": "^4.4.0",
        "cordova-plugin-compat": "^1.1.0",
        "cordova-plugin-console": "^1.0.5",
        "cordova-plugin-device": "^1.1.4",
        "cordova-plugin-geolocation": "^2.4.3",
        "cordova-plugin-mauron85-background-geolocation": "^2.2.5",
        "cordova-plugin-splashscreen": "^4.0.3",
        "cordova-plugin-statusbar": "^2.2.1",
        "cordova-plugin-whitelist": "^1.3.1",
        "dotenv": "^4.0.0",
        "express": "^4.14.1",
        "ionic-angular": "3.5.0",
        "ionic-native": "2.9.0",
        "ionic-plugin-keyboard": "^2.2.1",
        "ionicons": "3.0.0",
        "ng2-cookies": "^1.0.6",
        "ng2-file-upload": "^1.2.0",
        "preboot": "^4.5.2",
        "rxjs": "5.4.0",
        "sw-toolbox": "3.6.0",
        "typescript": "^2.3.4",
        "zone.js": "0.8.12"
    },
    "devDependencies": {
        "@ionic/app-scripts": "1.3.12",
        "@ionic/cli-plugin-cordova": "1.4.0",
        "@ionic/cli-plugin-ionic-angular": "1.3.1",
        "node-sass": "^4.3.0",
        "raw-loader": "^0.5.1",
        "rollup-plugin-replace": "^1.1.1",
        "sass-loader": "^6.0.3"
    },

Thank you

Edit:

Here’s my environment info

global packages:

@ionic/cli-utils : 1.4.0
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.4.0

local packages:

@ionic/app-scripts              : 1.1.4
@ionic/cli-plugin-cordova       : 1.4.0
@ionic/cli-plugin-ionic-angular : 1.3.1
Cordova Platforms               : browser 4.1.0 ios 4.4.0
Ionic Framework                 : ionic-angular 3.5.0

System:

Node       : v8.1.0
OS         : macOS Sierra
Xcode      : Xcode 8.3.3 Build version 8E3004b 
ios-deploy : 1.9.1 
ios-sim    : not installed
npm        : 5.0.3
2

Only upgrade to the Typescript version recommended for Ionic 3.5. I can’t look up which one it is at the moment, but going past that can cause weird errors.

3

I have typescript at 2.3.4 right now, which is the recommended version for ionic-angular 3.5.0. Any other suggestions on how to track this down?

4

For one thing, get rid of the old “ionic-native” dependency. I would then recommend completely blowing away node_modules and whatever the npm5 lock file is called and reinstalling all node dependencies from scratch with npm i.

5

Same as in 3.4.0:

“typescript”: “2.3.4”
Release 3.4.0 · ionic-team/ionic-framework · GitHub
But it belongs in devDependencies.

You should clean the rest out a bit as well.

6

Nuking the package-lock and the node modules then reinstalling did the trick. Thanks

1 Like