`eslint-plugin-wc`

ESLint plugin for Web Components.

Install

Assuming you already have ESLint installed, run:

# npm
npm install eslint-plugin-wc --save-dev

# yarn
yarn add eslint-plugin-wc --dev

Usage

Then extend the recommended eslint config:

{
  "extends": [
    // ...
    "plugin:wc/recommended"
  ]
}

Or if you're using ESLint flat configs, add this to your eslint.config.js:

import {configs} from 'eslint-plugin-wc';

export default [
  configs['flat/recommended'],

  // or if you want to specify `files`, or other options
  {
    ...configs['flat/recommended'],
    files: ['test/**/*.js']
  }
];

You should also specify settings that will be shared across all the plugin rules. (More about eslint shared settings)

{
  "settings": {
    "wc": {
      "elementBaseClasses": ["LitElement"] // Recognize `LitElement` as a Custom Element base class
    }
  }
}

Custom Configuration

If you want more fine-grained configuration, you can instead add a snippet like this to your ESLint configuration file:

{
  "plugins": [
    // ...
    "wc"
  ],
  "rules": {
    // ...
    "wc/no-invalid-element-name": "error",
    "wc/no-typos": "warn"
  }
}

Supported Rules

Possible Errors (Recommended)

Best Practice

Preference/convention

Shareable configurations

Best Practices

This plugin exports a best-practice configuration that enforces WebComponent best practices.

To enable this configuration use the extends property in your .eslintrc config file:

{
  "extends": ["eslint:recommended", "plugin:wc/best-practice"]
}

Note: These configurations will enable sourceType: 'module' in parser options.

License

eslint-plugin-wc is licensed under the MIT License.

43081j/eslint-plugin-wc

eslint-plugin-wc