eslint-plugin-lit

ESLint plugin for Lit.
Install
Assuming you already have ESLint installed, run:
# npm
npm install eslint-plugin-lit --save-dev
# yarn
yarn add eslint-plugin-lit --dev
Usage
Then extend the recommended eslint config:
{
"extends": [
// ...
"plugin:lit/recommended"
]
}
Or if you're using (flat) config files, add to your eslint.config.js
:
import {configs} from 'eslint-plugin-lit';
export default [
configs['flat/recommended'],
// or if you want to specify `files`, or other options
{
...configs['flat/recommended'],
files: ['test/**/*.js']
}
];
You can also specify settings that will be shared across all the plugin rules.
{
settings: {
lit: {
elementBaseClasses: ['ClassExtendingLitElement'] // Recognize `ClassExtendingLitElement` as a sub-class of LitElement
}
}
}
Custom Configuration
If you want more fine-grained configuration, you can instead add a snippet like this to your ESLint configuration file:
{
"plugins": [
// ...
"lit"
],
"rules": {
// ...
"lit/no-legacy-template-syntax": "error",
"lit/no-template-arrow": "warn"
}
}
List of supported rules
Shareable configurations
Recommended
This plugin exports a recommended
configuration that enforces Lit good practices.
To enable this configuration use the extends
property in your .eslintrc
config file:
{
"extends": ["eslint:recommended", "plugin:lit/recommended"]
}
Usage with eslint-plugin-wc
We highly recommend you also depend on
eslint-plugin-wc as it will
provide additional rules for web components in general:
npm i -D eslint-plugin-wc
Then extend the recommended eslint config:
{
"extends": ["plugin:wc/recommended", "plugin:lit/recommended"]
}
License
MIT