How can I get ESLint to lint HTML files in VSCode?

Question

I have a Javascript browser project split over multiple files and can\'t get ESLint to lint the script tags of my HTML file under the same global scope so that declarations and

Answer 1

I have this in <projectfolder>/.vscode/settings.json

{
  "eslint.validate": [ "javascript", "html" ]
}

I'm using an .eslintrc.js that looks like this

module.exports = {
  "env": {
    "browser": true,
    "es6": true
  },
  "plugins": [
    "eslint-plugin-html",
  ],
  "extends": "eslint:recommended",
  "rules": {
  }
};

I have lots of rules defined but didn't paste them above

Result:

Answer 2

• Open .html file
• Open OUTPUT panel
• Select ESLint channel
• See errors and fix them

Answer 3

Use eslint-plugin-html:

1. Run npm install eslint-plugin-html --save-dev in your Terminal.
2. Open .eslintrc.js and add there plugins: ["html"] right after module.exports. If you have .json or different format than the .js then just follow the pattern and add the same values on the same nesting level.
3. Run ./node_modules/.bin/eslint --ext .html . in your terminal.