ionic v2 tutorial starter in typescript mode fails when running ionic serve

[matthieugayon]

Hi there,

the js version works but I can't get the typescript version running, I get that error when running ionic serve :

TypeScript error: app/app.ts(8,2): Error TS2348: Value of type 'typeof App' is not callable. Did you mean to include 'new'?

I tried different version of nvm ( v4.2.6 and v6.2.1 ) hoping that could solve the problem ...

It seems to me it's mainly a problem of typescript transpilation, but as I am not very experienced with typescript I can't really wrap my head around.

[jthoms1]

Could you provide me with the output from ionic info from within your project directory? Thanks, this should help in troubleshooting.

[matthieugayon]

Thks for your quick reply jthoms, here is the ionic info log :

Your system information:

Cordova CLI: Not installed Gulp version: CLI version 3.9.0 Gulp local: Local version 3.9.1 Ionic Framework Version: 2.0.0-beta.8 Ionic CLI Version: 2.0.0-beta.30 Ionic App Lib Version: 2.0.0-beta.16 ios-deploy version: Not installed ios-sim version: Not installed OS: Mac OS X Mavericks Node Version: v6.2.1 Xcode version: Not installed

---

Dependency warning - for the CLI to run correctly, it is highly recommended to install/upgrade the following:

Please install your Cordova CLI to version >=4.2.0 npm install -g cordova Install ios-sim to deploy iOS applications.npm install -g ios-sim (may require sudo) Install ios-deploy to deploy iOS applications to devices. npm install -g ios-deploy (may require sudo)

---

[matthieugayon]

does it have anything to do with that ? https://github.com/driftyco/ionic/issues/6747

[matthieugayon]

Ok I could solve it by replacing the generated content of App.ts by :

`import {Component, ViewChild} from '@angular/core'; import {App, Platform, MenuController, Nav, ionicBootstrap} from 'ionic-angular'; import {StatusBar} from 'ionic-native'; import {HelloIonicPage} from './pages/hello-ionic/hello-ionic'; import {ListPage} from './pages/list/list';

@Component({ templateUrl: 'build/app.html', }) class MyApp { @ViewChild(Nav) nav: Nav;

// make HelloIonicPage the root (or first) page rootPage: any = HelloIonicPage; pages: Array<{title: string, component: any}>;

constructor( private platform: Platform, private menu: MenuController ) { this.initializeApp();

// set our app's pages
this.pages = [
  { title: 'Hello Ionic', component: HelloIonicPage },
  { title: 'My First List', component: ListPage }
];

}

initializeApp() { this.platform.ready().then(() => { // Okay, so the platform is ready and our plugins are available. // Here you can do any higher level native things you might need. StatusBar.styleDefault(); }); }

openPage(page) { // close the menu when clicking a link from the menu this.menu.close(); // navigate to the new page if it is not the current page this.nav.setRoot(page.component); } }

ionicBootstrap(MyApp);`

I just had to generate another starter and see what's going on.