Ionic serve crashes but saving a js file makes it run properly


#1

I recently started working on an app using ionic 3. Along the course of development, i found that everytime i run ionic serve, I get errors like “Property ‘UserObj’ does not exist on type ‘UserDataProvider’” in many of the providers and directives but when i save any .ts file, the ionic live reload refreshes the page and everything works as expected.

Any help here will be greatly appreciated. I have added the details of my setup below.

cli packages:

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 8.0.0 

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : none
Ionic Framework    : ionic-angular 3.9.2

System:

Node : v8.10.0
npm  : 5.6.0 
OS   : macOS High Sierra

#2

Please post complete examples of these error message you are getting.

Can you explain how exactly you are doing that, and which files? Ionic apps are written with Typescript in .ts files usually, so I am not sure what you mean here.


#3

Thanks for the reply and sorry about the delay. I found a solution thro another thread in the forum.

Sorry I was indeed referring to the .ts files.

The following would throw similar error on “uobj”, the first time i run “ionic serve”. Any save to any of the .ts files would reload the browser and the app starts working until I stop the livereload and run ionic serve again.

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { UserDataProvider } from '../../providers/user-data/user-data';

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {

  constructor(public navCtrl: NavController, public navParams: NavParams,  private uobj:UserDataProvider) {


  }

}

This error is fixed if I change the code to below.

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { UserDataProvider } from '../../providers/user-data/user-data';

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {
  private uobj;
  constructor(public navCtrl: NavController, public navParams: NavParams,  uobj:UserDataProvider) {
   this.uobj = uobj;

  }

}

Thanks for your time.