Why do AngularJS directives (attributes, etc.) show up as “invalid” in WebStorm 8?

Question

I just installed WebStorm 8 a couple of hours ago. I\'ve been writing some AngularJS stuff, and I have a rather annoying little problem. The AngularJS plugin seems to work parti

Answer 1

Are you refrenceing AngularJS from a CDN in your HTML? If so just download angular and reference the local copy in your HTML. Then the angular features should start working. Alternatively I think you can just click the path to the angular CDN in your html, press Alt+Enter and select something like download library.

Answer 2

Also make sure you have the jebrains AngularJS plugin

Answer 3

To add Angular JS as a Project library go to

Preferences > Project Settings > JavaScript > Libraries > Add

and then select the Angular directory to add it.

I'm on a Mac but windows should be roughly similar.

You can also do

ctrl/cmd + shift + a

(go to anywhere) and type libraries to get to the same place.

Note: I have Angular referenced in my main html file via https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js and the it works without adding it as a library.

Edit:

From the Webstorm blog: If you prefer to use a CDN, place the cursor over the highlight library name, hit Alt+Enter, and Download Library. This will set up a local library in WebStorm’s cache (not in your project) so WebStorm can access AngularJS methods, directives, etc for autocompletion and documentation lookup.

Answer 4

To resolve this in IntelliJ I downloaded the angular library.

These are the steps.

To add a TypeScript definition file for a library or framework you use, go to Preferences | Languages & Frameworks | JavaScript | Libraries – click Download and search for the library you need by typing its name, then hit Download again.