@nice-move/eslint-plugin-html

ESLint plugin to lint script tags in HTML.

Installation

npm install @nice-move/eslint-plugin-html --save-dev

Usage

// eslintrc.js

module.exports = {
  extends: ['plugin:@nice-move/html/recommended']
};

// or

module.exports = {
  extends: ['plugin:@nice-move/html/base']
};

// or

module.exports = {
  overrides: [
    {
      files: ['*.{htm,html}'],
      plugins: ['@nice-move/eslint-plugin-html']
    },
    {
      files: ['**/*.{htm,html}/**/html-script-legacy.js'],
      parserOptions: {
        sourceType: 'script'
      }
    },
    {
      files: ['**/*.{htm,html}/**/html-script-module.js'],
      parserOptions: {
        sourceType: 'module'
      }
    }
  ]
};

Todos

• [ ] SVG support

Tips

Different from eslint-plugin-html

@nice-move/eslint-plugin-html using processor to treat <script> and <script type="module"> differently.

See: https://github.com/BenoitZugmeyer/eslint-plugin-html/issues/139

And @nice-move/eslint-plugin-html is bundle-able.

Visual Studio Code support

When using Eslint for VS Code, you may need to add following code to settings:

// example: settings.json or .vscode/settings.json
// I don't know why `eslint-plugin-html` don't need this.
{
  "eslint.validate": ["html"]
}

Known Issues

Not compatible with import/first rule.

See: https://github.com/import-js/eslint-plugin-import/issues/2407

<script>
  console.log('this example trigger error');
  import 'http://something';
</script>

Can't share variable between multiple script tags

See: Reason why