Gullu
Gullu

Reputation: 3529

WebStorm unknown HTML tag Angular 2

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.

Upvotes: 4

Views: 7757

Answers (4)

Parikshit Singh
Parikshit Singh

Reputation: 237

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)

enter image description here

Upvotes: 1

Johnyoat
Johnyoat

Reputation: 456

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

Upvotes: 2

ilya.chepurnoy
ilya.chepurnoy

Reputation: 515

@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.

Upvotes: 1

lena
lena

Reputation: 93728

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

Upvotes: 12

Related Questions