Angular 2 bootstrap function gives error “Argument type AppComponent is not assignable to parameter type Type”

Question

Here is my first simple Hello World angular 2 app from Angular 2 quick start guide.

import {Component} from \'angular2/core\';
import {bootstrap} fr         


        

Answer 1

IMO changing the code all over just so that WebStorm / IntelliJ will not complain is not a viable solution. Since I have a separate bundling / compiling process I instead disabled IntelliJ's ops on typescript: Settings->Languages->Typescript - uncheck the options there. If that is already the case for you than you can try checking the options, applying and then unchecking again.

You can see this is still a bit buggy. For example after I have done some class renaming using the IDE (SHIFT + F6) the errors returned. Repeating the above removed them again.

Using IntelliJ 15.0.2

Answer 2

I stumbled on this in Intellij 2016.1.2, with the Angular quickstart demo. Setting the following options in IDE helped:

Answer 3

Actually, AppComponent is expected to extend Type. So use the following:

// app.component.ts
import { Component, Type } from '@angular2/core';

@Component({
...
...
})
export class AppComponent extends Type {}

This will also follow the expected convention by ng2 for AppComponent (to be bootstrapped).

I am not sure why they didn't cover it in the ng2 tutorials, probably they might be targeting to simplify the initial learning, as it runs even without the extends part.

This works perfectly fine in WebStorm/IntelliJ.

Edit: Alternate solution is to update to Webstorm v2016.2 (which is stable at the time of this comment).

Answer 4

//noinspection TypeScriptValidateTypes Worked for me in WebStorm.

Also I've opened my project in IntelIJ instead and there was no error.

Answer 5

Webstorm 2016.1.3 the solution above works for me

Settings -> Language & Frameworks -> TypeScript: Enable TypeScript, Use tsconfig.json

PS: This is the same solution as described before for previous Webstorm version (2016.1.3)

Answer 6

This error introducing due to TypeScript compiler is not enabled in your IDE. you need to enable TypeScript compiler.

Enable Typescript compiler in Webstorm:

go to Webstorm menu(upper left menu) => Preferences menu => Languages & Frameworks => click on TypeScript => Enable Typescript compiler(enable checkbox) => enable Use tsconfig.json option => click Ok button and you are done.