Typescript Errors when running ionic serve

Ionic Framework ionic-v3
1

i have typescript": “^2.3.3”. when i trie to run with ionic serve i get thos error
Typescript Error

Class ‘Tabs’ incorrectly implements interface ‘NavigationContainer’. Types of property ‘parent’ are incompatible. Type ‘NavControllerBase’ is not assignable to type ‘NavController’. Types of property ‘popTo’ are incompatible. Type ‘(indexOrViewCtrl: any, opts?: NavOptions, done?: () => void) => Promise’ is not assignable to type ‘(page: string | Page | ViewController, params?: any, opts?: NavOptions, done?: Function) => Promi…’. Types of parameters ‘done’ and ‘opts’ are incompatible. Type ‘NavOptions’ is not assignable to type ‘() => void’.

Typescript Error

Class ‘NavControllerBase’ incorrectly implements interface ‘NavController’. Types of property ‘popTo’ are incompatible. Type ‘(indexOrViewCtrl: any, opts?: NavOptions, done?: () => void) => Promise’ is not assignable to type ‘(page: string | Page | ViewController, params?: any, opts?: NavOptions, done?: Function) => Promi…’. Types of parameters ‘done’ and ‘opts’ are incompatible. Type ‘NavOptions’ is not assignable to type ‘() => void’. Type ‘NavOptions’ provides no match for the signature ‘(): void’.

Typescript Error

Class ‘Subject’ incorrectly extends base class ‘Observable’. Types of property ‘lift’ are incompatible. Type ‘(operator: Operator<T, R>) => Observable’ is not assignable to type ‘(operator: Operator<T, R>) => Observable’. Type ‘Observable’ is not assignable to type ‘Observable’. Type ‘T’ is not assignable to type ‘R’.

Typescript Error

Class ‘WebSocketSubject’ incorrectly extends base class ‘AnonymousSubject’. Types of property ‘lift’ are incompatible. Type ‘(operator: Operator<T, R>) => WebSocketSubject’ is not assignable to type ‘(operator: Operator<T, R>) => Observable’. Type ‘WebSocketSubject’ is not assignable to type ‘Observable’. 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’.

…
those errors appears since i upgrade ionic.
here’s a screen shot of my ionic info

Sans%20titre
Sans titre.png902×410 11.1 KB

i have tied to ugrade typescript version to 3.5.3 but still get the same issues !!?
Any suggestion?

2

Hi ashok12 don’t worry I am here to help you, do below steps

npm install toolkit

npm rebuild --force

npm i

it will fixed,
cheers!!

1 Like
3

Sorry it doesn’t fixe it. it make it even worse
thanks for your suggestion anyway.

4

Could you please post package.json? It looks like you have some sort of frankenproject that is a mishmash of incompatible versions of things.

5

here’s my package.json

{
    "name": "",
    "author": "Platform",
    "homepage": "",
    "private": true,
    "scripts": {
        "clean": "ionic-app-scripts clean",
        "build": "ionic-app-scripts build",
        "ionic:build": "ionic-app-scripts build",
        "ionic:serve": "ionic-app-scripts serve"
    },
    "dependencies": {
        "@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/tsc-wrapped": "^4.3.3",
        "@ionic-native/camera": "^4.1.0",
        "@ionic-native/core": "4.1.0",
        "@ionic-native/document-viewer": "^4.1.0",
        "@ionic-native/facebook": "^4.1.0",
        "@ionic-native/file": "^4.1.0",
        "@ionic-native/file-opener": "^4.1.0",
        "@ionic-native/file-path": "^4.1.0",
        "@ionic-native/file-transfer": "^4.1.0",
        "@ionic-native/image-resizer": "^4.1.0",
        "@ionic-native/local-notifications": "^4.1.0",
        "@ionic-native/splash-screen": "4.1.0",
        "@ionic-native/status-bar": "4.1.0",
        "@ionic/storage": "2.0.1",
        "@types/cordova": "0.0.34",
        "@types/node": "^7.0.27",
        "cheerio": "^1.0.0-rc.2",
        "colors": "^1.1.2",
        "cordova-android": "^6.2.1",
        "cordova-plugin-camera": "~2.4.1",
        "cordova-plugin-console": "1.0.5",
        "cordova-plugin-device": "1.1.4",
        "cordova-plugin-facebook4": "^1.9.1",
        "cordova-plugin-whitelist": "1.3.1",
        "csp-parse": "0.0.2",
        "elementtree": "^0.1.7",
        "ionic": "^5.2.3",
        "ionic-angular": "3.5.3",
        "ionic-plugin-keyboard": "~2.2.1",
        "ionic2-alpha-scroll": "^2.0.1",
        "ionicons": "3.0.0",
        "lodash": "^4.17.15",
        "native-run": "^0.2.8",
        "natives": "^1.1.6",
        "ng2-pdf-viewer": "^1.1.0",
        "plist": "^2.1.0",
        "readable-stream": "^2.3.3",
        "rxjs": "5.4.0",
        "sw-toolbox": "3.6.0",
        "toolkit": "^1.5.4",
        "tslint": "3.15.1",
        "tslint-ionic-rules": "0.0.8",
        "util-deprecate": "^1.0.2",
        "zone.js": "0.8.12"
    },
    "devDependencies": {
        "@ionic/app-scripts": "^3.2.4",
        "@ionic/cli-plugin-cordova": "1.4.1",
        "@ionic/cli-plugin-ionic-angular": "1.3.2",
        "@types/lodash": "^4.14.71",
        "grunt": "^1.0.4",
        "grunt-contrib-jshint": "^2.1.0",
        "grunt-contrib-nodeunit": "^2.0.0",
        "grunt-contrib-uglify": "^4.0.1",
        "gulp": "^4.0.2",
        "gulp-clean-css": "^4.2.0",
        "gulp-rename": "1.2.2",
        "gulp-replace": "0.5.4",
        "gulp-sass": "^3.1.0",
        "gulp-tslint": "6.1.2",
        "node-sass": "^4.12.0",
        "typescript": "^2.3.3"
    },
    "cordovaPlugins": [
        "cordova-plugin-whitelist",
        "cordova-plugin-console",
        "cordova-plugin-device",
        "ionic-plugin-keyboard"
    ],
    "cordovaPlatforms": [
        "andoid",
        {
            "platform": "android",
            "version": "",
            "locator": "android"
        }
    ],
    "description": "",
    "cordova": {
        "plugins": {
            "cordova-plugin-console": {},
            "cordova-plugin-device": {},
            "cordova-plugin-whitelist": {},
            "ionic-plugin-keyboard": {},
            "cordova-plugin-camera": {},
            "cordova-plugin-facebook4": {
                "APP_ID": "",
                "APP_NAME": ""
            }
        },
        "platforms": [
            "android"
        ]
    }
}
6

Can you try creating a new project with:

$ ionic start --type=ionic-angular

…and see if you are able to build and run that? If so, then try parachuting your code from the broken project into that building project and try to solve this that way.