Typescript error upon app load

CharlieIGG commented 5 years ago

After installing mobx-angular everytime I start the project I get Typescript errors that prevent rendering, where the corresponding mobx interfaces are not found. However, if I save any file and the app recompiles, then it all works again (including all my mobx observables), but then again after working for a while, on the Nth save it fails again.

Here's the tslint output:

[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/core/atom.d.ts, line: 2 
[app-scripts]             '=' expected. 
[app-scripts]        L1:  import { IDerivationState, IObservable } from "../internal";
[app-scripts]        L2:  export declare const $mobx: unique symbol;
[app-scripts]        L3:  export interface IAtom extends IObservable {
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/utils/decorators.d.ts, line: 1 
[app-scripts]             '=' expected. 
[app-scripts]        L1:  export declare const mobxDidRunLazyInitializersSymbol: unique symbol;
[app-scripts]        L2:  export declare const mobxPendingDecorators: unique symbol;
[app-scripts]             '=' expected. 
[app-scripts]        L1:  export declare const mobxDidRunLazyInitializersSymbol: unique symbol;
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/utils/decorators.d.ts, line: 2 
[app-scripts]        L2:  export declare const mobxPendingDecorators: unique symbol;
[app-scripts]        L3:  export declare type BabelDescriptor = PropertyDescriptor & {
[app-scripts]             Cannot find name 'unique'. 
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/core/atom.d.ts, line: 2 
[app-scripts]        L1:  import { IDerivationState, IObservable } from "../internal";
[app-scripts]        L2:  export declare const $mobx: unique symbol;
[app-scripts]        L3:  export interface IAtom extends IObservable {
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/core/atom.d.ts, line: 2 
[app-scripts]             Cannot find name 'symbol'. Did you mean 'Symbol'? 
[app-scripts]        L1:  import { IDerivationState, IObservable } from "../internal";
[app-scripts]        L2:  export declare const $mobx: unique symbol;
[app-scripts]        L3:  export interface IAtom extends IObservable {
[app-scripts]             A computed property name in a class property declaration must directly refer to a built-in symbol. 
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/types/observablemap.d.ts, line: 34 
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/utils/decorators.d.ts, line: 1 
[app-scripts]       L33:  name: string;
[app-scripts]       L34:  [$mobx]: {};
[app-scripts]       L35:  private _data;
[app-scripts]             Cannot find name 'unique'. 
[app-scripts]        L1:  export declare const mobxDidRunLazyInitializersSymbol: unique symbol;
[app-scripts]        L2:  export declare const mobxPendingDecorators: unique symbol;
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/utils/decorators.d.ts, line: 1 
[app-scripts]             Cannot find name 'symbol'. Did you mean 'Symbol'? 
[app-scripts]        L1:  export declare const mobxDidRunLazyInitializersSymbol: unique symbol;
[app-scripts]        L2:  export declare const mobxPendingDecorators: unique symbol;
[app-scripts]             Cannot find name 'unique'. 
[app-scripts]        L1:  export declare const mobxDidRunLazyInitializersSymbol: unique symbol;
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/utils/decorators.d.ts, line: 2 
[app-scripts] [12:14:33]  typescript: node_modules/mobx/lib/utils/decorators.d.ts, line: 2 
[app-scripts]        L2:  export declare const mobxPendingDecorators: unique symbol;
[app-scripts]        L3:  export declare type BabelDescriptor = PropertyDescriptor & {
[app-scripts]             Cannot find name 'symbol'. Did you mean 'Symbol'? 
[app-scripts]        L1:  export declare const mobxDidRunLazyInitializersSymbol: unique symbol;
[app-scripts]        L2:  export declare const mobxPendingDecorators: unique symbol;
[app-scripts]        L3:  export declare type BabelDescriptor = PropertyDescriptor & {

I'm unsure if this may be related to #51 ...

...

package.json

{
"name": "billygo-technician",
"version": "1.0.2",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"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"
},
"config": {
    "ionic_webpack": "./config/webpack.config.js"
},
"dependencies": {
    "@angular/animations": "^5.2.2",
    "@angular/common": "5.0.3",
    "@angular/compiler": "5.0.3",
    "@angular/compiler-cli": "5.0.3",
    "@angular/core": "^5.2.2",
    "@angular/forms": "5.0.3",
    "@angular/http": "5.0.3",
    "@angular/platform-browser": "5.0.3",
    "@angular/platform-browser-dynamic": "5.0.3",
    "@ionic-native/android-permissions": "^4.5.3",
    "@ionic-native/call-number": "^4.5.3",
    "@ionic-native/camera": "^4.5.3",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/device": "^4.5.3",
    "@ionic-native/fcm": "^4.7.0",
    "@ionic-native/file": "^4.5.3",
    "@ionic-native/file-path": "^4.5.3",
    "@ionic-native/geolocation": "^4.5.3",
    "@ionic-native/ionic-webview": "^5.0.0-beta.21",
    "@ionic-native/launch-navigator": "^4.7.0",
    "@ionic-native/screen-orientation": "^4.5.3",
    "@ionic-native/sms": "^4.5.3",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic-native/stripe": "^4.5.3",
    "@ionic-native/transfer": "^3.14.0",
    "@ionic/storage": "2.1.3",
    "@types/node": "^9.4.0",
    "angular2-jwt-simple": "^0.5.4",
    "angular2-signaturepad": "^2.6.1",
    "build": "0.1.4",
    "call-number": "^1.0.1",
    "circular-dependency-plugin": "^4.4.0",
    "cleave.js": "^1.3.7",
    "cordova": "^8.1.2",
    "cordova-android": "6.4.0",
    "cordova-background-geolocation-lt": "^2.14.2",
    "cordova-ios": "4.5.5",
    "cordova-plugin-actionsheet": "^2.3.3",
    "cordova-plugin-android-permissions": "^1.0.0",
    "cordova-plugin-background-fetch": "^5.4.1",
    "cordova-plugin-camera": "^4.0.3",
    "cordova-plugin-cocoalumberjack": "0.0.4",
    "cordova-plugin-device": "^1.1.7",
    "cordova-plugin-dialogs": "^2.0.1",
    "cordova-plugin-fcm": "^2.1.2",
    "cordova-plugin-file": "^6.0.1",
    "cordova-plugin-file-transfer": "^1.7.1",
    "cordova-plugin-filepath": "^1.4.2",
    "cordova-plugin-geolocation": "^4.0.1",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^2.2.5",
    "cordova-plugin-screen-orientation": "^3.0.1",
    "cordova-plugin-splashscreen": "^4.1.0",
    "cordova-plugin-statusbar": "git+https://github.com/apache/cordova-plugin-statusbar.git",
    "cordova-plugin-stripe": "^1.5.3",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-sms-plugin": "^0.1.13",
    "es6-promise-plugin": "^4.2.2",
    "highcharts": "^6.0.4",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "markerwithlabel": "^2.0.1",
    "mobx": "^5.6.0",
    "mobx-angular": "^3.0.1",
    "moment": "^2.20.1",
    "mx.ferreyra.callnumber": "0.0.2",
    "phoenix-socket": "^1.2.3",
    "plugin": "^0.3.3",
    "quick-local-ip": "^1.0.7",
    "rxjs": "5.5.2",
    "sw-toolbox": "3.6.0",
    "uk.co.workingedge.phonegap.plugin.launchnavigator": "^4.2.2",
    "zone.js": "0.8.18"
},
"devDependencies": {
    "@ionic/app-scripts": "3.2.0",
    "typescript": "2.4.2"
},
"description": "App for BillyGo Technicians",
"cordova": {
    "plugins": {
        "cordova-background-geolocation-lt": {
            "GOOGLE_API_VERSION": "11.2.0",
            "APPCOMPAT_VERSION": "26.1.0",
            "LOCATION_ALWAYS_AND_WHEN_IN_USE_USAGE_DESCRIPTION": "Always use is required for background location tracking",
            "LOCATION_ALWAYS_USAGE_DESCRIPTION": "Background location-tracking is required",
            "LOCATION_WHEN_IN_USE_USAGE_DESCRIPTION": "Background location-tracking is required",
            "MOTION_USAGE_DESCRIPTION": "Using the accelerometer increases battery-efficiency by intelligently toggling location-tracking only when the device is detected to be moving",
            "LICENSE": "YOUR_LICENSE_KEY",
            "BACKGROUND_MODE_LOCATION": "<string>location</string>"
        },
        "cordova-plugin-android-permissions": {},
        "cordova-plugin-camera": {
            "CAMERA_USAGE_DESCRIPTION": "Allow the app to use your camera",
            "PHOTOLIBRARY_USAGE_DESCRIPTION": "Allow the app to access your photos"
        },
        "cordova-plugin-device": {},
        "cordova-plugin-fcm": {},
        "cordova-plugin-file-transfer": {},
        "cordova-plugin-file": {},
        "cordova-plugin-filepath": {},
        "cordova-plugin-geolocation": {},
        "cordova-plugin-ionic-keyboard": {},
        "cordova-plugin-screen-orientation": {},
        "cordova-plugin-splashscreen": {},
        "cordova-plugin-statusbar": {},
        "uk.co.workingedge.phonegap.plugin.launchnavigator": {
            "OKHTTP_VERSION": "3.+",
            "LOCATION_USAGE_DESCRIPTION": "This app requires access to your location for navigation purposes"
        },
        "cordova-plugin-stripe": {},
        "cordova-plugin-whitelist": {},
        "cordova-sms-plugin": {},
        "mx.ferreyra.callnumber": {},
        "call-number": {},
        "cordova-plugin-ionic-webview": {}
    },
    "platforms": [
        "android",
        "ios"
    ]
}
}

browser Google Chrome 70.0.3538.102 (Official Build) (64-bit)

EDIT - This also seems to be preventing me from compiling the Ionic project.

CharlieIGG commented 5 years ago

If anybody stumbles into this, the most recent Mobx types require Typescript v2.7.0+ to work properly.

adamkleingit commented 5 years ago

@CharlieIGG thanks for sharing the solution with everyone!

andrisole92 commented 4 years ago

Got the same issue, updated typescript, still having.

adamkleingit commented 4 years ago

From examining the errors, it looks like a problem with mobx, not mobx-angular. Can you open it there?

mobxjs / mobx-angular

Typescript error upon app load #82