WebStorm 未知的 HTML 标签 Angular 2

Question

Just downloaded latest WebStorm trial to try out on existing Angular 2 CLI v6.2.4.

I did the file open of my root project folder. I see all the files in IDE explorer. However cannot navigate code ( Ctrl + F1 ) says unknown HTML tag.

What are the steps to configure WebStorm for Angular 2? I googled and also went to Settings -> Languages & Frameworks -> JS -> Libraries -> Add and not listed there.

For "Create new project" I do see Angular listed but this is an existing CLI project created outside of WebStorm.

Please advise how to setup.

Answer 1

Please make sure that AngularJS plugin is enabled in Preferences | Plugins and @angular node_modules are not excluded from project: Angular support is only enabled if node_modules/@angular folder is included in index. Expand node_modules in Project tool window to check what @angular folder looks like there: excluded folders usually have orange color

Answer 2

@Gullu, I'solved very similar error (PHPStorm's Code analysis would yell at me) by going where you said (Settings \\ Languages and Frameworks \\ Javascript \\ Libraries), button 'Download', and from there in dropdown I've selected typing for angular and angular-material (took me 2 steps). All was fine after that.

Answer 3

Close Webstorm, delete node_modules and .idea folder. Perform fresh install and open the project again.

Answer 4

Your dev dependencies are probably not installed.

try npm i --only=dev

And if this does not work it is probably the issue with the ide identifying the angular modules.

adding the node_modules in preferences > language and frameworks > javascript > libraries might help

Here is how to do it:

1. click add
2. An edit libary popup will open.
3. Name the library anything you want.
4. choose Node.js core modules as framework type.
5. keep the visibility set on project .
6. we dont need to add anything in the documentation urls.
7. Now click on the first "+" button and add the node_modules directory from your project.

After you have successully added the library, click on "apply" and then "ok".

The ide will take some time depending on your processor but that processing is just one time only.For the subsequent loads it wont take that long. (PS: You can also restart the ide to reduce the memory usage just after all the modules the loaded)