AngularJS 2.0 TypeScript Intellij idea (or webstorm) - ES6 import syntax

Question

Trying to make these steps to make AngularJS 2.0 sample app running.

On that step, putting code in app.ts:

/// <reference path="typings/angular2/angular2.d.ts" />
import {Component, View, bootstrap} from 'angular2/angular2';

Got latest 14.1.3 IntelliJ IDE.

But seems it does not understand 'import' (highlighting complain)

Q: IS that because It does not support yet TypeScript 1.5? (it the IDE settings I can see embedded 1.4 version). Could it be compiled with that IDE?

Answer 1

it look like you didn't specify the compiler arguments to tell which module loader to use, also you want to make sure you are using the latest TypeScript Compiler, to this date the latest was 1.5.0 beta.

First

You can download the bin of the TypeScript compiler tsc and all other related files on their GitHub Repository: https://github.com/Microsoft/TypeScript/tree/master/bin

or you can also install it as a Node.js Package:

npm install -g typescript

Second

You need to configure intelliJ properly by changing the Compiler version to custom and point to the location of the latest TypeScript bin folder

in IntelliJ press Ctrl+Alt+S, search for TypeScript and under Languages & Frameworks select TypeScript, make sure your IntelliJ is up to date though.

And to solve the problem you are asking here specify the following Command Line options:

--module "amd" --target "es5"

Screenshot:

Third

It is worth mentioning that the TypeScript 1.5 compiler and Angular 2 are both in Beta so this answer could be irrelevant in the following weeks or month.

Enjoy!

Dany

Answer 2

you need select javascript version in Preferences page.

Languages & Frameworks -> JavaScript

on the right page. JavaScript language version dropdown menu. on my idea it's has some item below.

JavaScript 1.5 ECMAScript 5.1 JavaScript 1.6 JavaScript 1.7 JavaScript 1.8 JavaScript 1.8.6 ECMAScript 6 ...