Ionic2 typescript + webstorm

Hello, I wanted to try ionic2(typesript version) and webstorm(never used this IDE before). But I’ve encountered ‘reference problem’ - there is no reference files inside angular and ionic core files as well as tutorial, that lead to errors in IDE. Is there any way to teach Webstorm to handle webpack based project? Thank you.

Maybe you could elaborate a little bit more? I use Webstorm with an ionic2 project for a couple of weeks now. It’s not perfect yet, but that might be because it’s all Beta software and IDE updates are less frequent.

I just use the tool since I love the Jetbrains products and Use Intellij for Java. Since somewhere end of last week I had some problems that standard classes like Promise were not being recognised. It did before.

I believe it might be fixed in a bit, but otherwise I’d like to try any solutions offered by people.

I’ve installed Ionic2 with tutorial temaplate there is in app.ts file and it full of errors in Webstorm becouse it cannot resolve files - corresponding file is not included in tsconfig.json error. I can beat it with /// <reference path="..." /> for impoted files or adding files to .tsconfig but its a bit awkward i think.

sorry for the noob question but a little help will be appreciated.
i have been trying to use ionic using webstorm could please tell me how did you did it.
I make a new angular js file and then add the ionic project to run it but it doesn’t recognizes the code and fails. could you please tell me how to do it properly for ionic 2.
i have cordova,node,android sdk. (anything else i am missing).

You should probably look into plugins, and get the Cordova plugin (it includes ionic) then you can set up run configs like you would do in cli

I have this same issue in my App.ts, luckily not in the rest of the Ts files, it all works fine. It is a nuisance, I suggest checking these kind of issues with Jetbrains though.

I also had these errors, I got rid of them by installing Typescript through npm (npm install -g typescript) and then setting the proper paths to typescript in the Webstorm settings dialog:

If I remember correctly this overrides the “built in” Typescript compiler.

This did the trick for me, the errors are gone.

1 Like

Thanx @leob, Your’s solution works fine :slight_smile:

Cool, glad to hear that!

Thank you @leob. Modifying the ‘Node interpreter’ and ‘Compiler version’ settings in WebStorm 2016.2.4 resolved the tsconfig.ts reference error I was getting. Specifically, changing from the bundled TS compiler version to the version installed locally during Ionic 2 environment setup, resolved the conflicts.

Glad to hear it worked for you!

Yes, once you configure it like this then it all just works, surprisingly easy.

I’m still relying on my trusty old Webstorm (version 8, old license, didn’t bother to pgrade) for Ionic/Angular, haven’t moved to shiny new things like “Atom” yet, Webstorm works well enough for me. It even supports new stuff like React with JSX … gets the job done for me.

By the way, for more background and some tricks you may also want to look at these articles:

https://blog.ionic.io/ionic-and-typings/
http://blog.ionic.io/ionic-and-typescript-part-1/
http://blog.ionic.io/ionic-and-typescript-part-2/
http://blog.ionic.io/ionic-and-typescript-part-3/
http://blog.ionic.io/ionic-and-typescript-part-4/