lit-html support for ESLint
npm install eslint-plugin-liteslint-plugin-lit



> ESLint plugin for Lit.
Assuming you already have ESLint installed, run:
``shnpm
npm install eslint-plugin-lit --save-dev
Usage
Then extend the recommended eslint config:
`js
{
"extends": [
// ...
"plugin:lit/recommended"
]
}
`Or if you're using (flat) config files, add to your
eslint.config.js:`ts
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.
`json5
{
settings: {
lit: {
elementBaseClasses: ['ClassExtendingLitElement'] // Recognize ClassExtendingLitElement as a sub-class of LitElement
}
}
}
`$3
If you want more fine-grained configuration, you can instead add a snippet like this to your ESLint configuration file:
`js
{
"plugins": [
// ...
"lit"
],
"rules": {
// ...
"lit/no-legacy-template-syntax": "error",
"lit/no-template-arrow": "warn"
}
}
`List of supported rules
- lit/attribute-names
- lit/attribute-value-entities
- lit/ban-attributes
- lit/binding-positions
- lit/lifecycle-super
- lit/no-classfield-shadowing
- lit/no-duplicate-template-bindings
- lit/no-invalid-escape-sequences
- lit/no-invalid-html
- lit/no-legacy-imports
- lit/no-legacy-template-syntax
- lit/no-native-attributes
- lit/no-private-properties
- lit/no-property-change-update
- lit/no-template-arrow
- lit/no-template-bind
- lit/no-template-map
- lit/no-this-assign-in-render
- lit/no-useless-template-literals
- lit/no-value-attribute
- lit/prefer-nothing
- lit/quoted-expressions
- lit/value-after-constraints
Shareable configurations
$3
This plugin exports a
recommended configuration that enforces Lit good practices.To enable this configuration use the
extends property in your .eslintrc config file:`js
{
"extends": ["eslint:recommended", "plugin:lit/recommended"]
}
`Usage with
eslint-plugin-wcWe highly recommend you also depend on
eslint-plugin-wc as it will
provide additional rules for web components in general:
`sh
npm i -D eslint-plugin-wc
`Then extend the recommended eslint config:
`json
{
"extends": ["plugin:wc/recommended", "plugin:lit/recommended"]
}
``MIT