All geek questions in one place

Microsoft VS Code and Angular 2 tags in HTML linter

I just started using Angular 2 in VSCode. Using the Angular.io “Tour of Heroes” example, the embedded HTML linker does not recognize Angular 2 directives in HTML tags, for example *ng-if or (click) , as you can see in this screenshot:

enter image description here

Are there any settings or extensions that I am missing? This is valid HTML in an Angular 2 application, and I don't want a lot of errors for anything, but I want to use linter in case I make actual errors elsewhere.

+2
source share
2 answers

You can add exceptions to the attribute list in the HTMLHint extension:

 "htmlhint.options": { "attr-lowercase": ["*ngIf", "*ngFor"] }

The attr-lowercase rule can be true, false, or an array of attribute names to ignore.

+1
source

Just add this fragment to the settings file (.vscode \ settings.json in the workspace or edit using the file> Settings> Settings):

 "htmlhint.options": { "tagname-lowercase": true, "attr-value-double-quotes": true, "attr-no-duplication": true, "tag-pair": true, "spec-char-escape": true, "id-unique": true, "src-not-empty": true, "title-require": true }

In this case, the HTMLHint plugin will correctly analyze Angular patterns and stop throw warnings.

0
source

Source: https://habr.com/ru/post/1266704/

More articles:


All Articles