Repository files navigation

Official ESLint rules for Lightning Web Components (LWC).

$ npm install eslint @babel/core @babel/eslint-parser @lwc/eslint-plugin-lwc --save-dev

Starting with v3.0.0, @lwc/eslint-plugin-lwc only supports eslint@v9. Use @lwc/eslint-plugin-lwc@v1.x for older versions of eslint.

Import@lwc/eslint-plugin-lwc and use it in theplugins section of your configuration as shown below. Then configure the desired rules in therules sections. Some of the syntax used in Lightning Web Components is not yet stage 4 (eg. class fields or decorators), and the out-of-the-box parser from ESLint doesn't support this syntax yet. In order to parse the LWC files properly, set theparser field to@babel/eslint-parser in thelanguageOptions section of the eslint config.

Example ofeslint.config.js:

consteslintPluginLwc=require('@lwc/eslint-plugin-lwc');constbabelParser=require('@babel/eslint-parser');module.exports=[{languageOptions:{parser:babelParser,parserOptions:{requireConfigFile:false,babelOptions:{parserOpts:{plugins:['classProperties',['decorators',{decoratorsBeforeExport:false}],],},},},},plugins:{'@lwc/lwc':eslintPluginLwc,// https://github.com/salesforce/eslint-plugin-lwc},rules:{'@lwc/lwc/no-deprecated':'error','@lwc/lwc/valid-api':'error','@lwc/lwc/no-document-query':'error','@lwc/lwc/ssr-no-unsupported-properties':'error',},},];

To enable working with TypeScript projects, install@babel/preset-typescript as a dependency add"typescript" tolanguageOptions.parserOptions.babelOptions.parserOpts.plugins in youreslint.config.js.

Example:

consteslintPluginLwc=require('@lwc/eslint-plugin-lwc');constbabelParser=require('@babel/eslint-parser');module.exports=[{languageOptions:{parser:babelParser,parserOptions:{requireConfigFile:false,babelOptions:{parserOpts:{plugins:['classProperties',['decorators',{decoratorsBeforeExport:false}],'typescript',],},},},},},];

For more details about configuration please refer to the dedicated section in the ESLint documentation:https://eslint.org/docs/user-guide/configuring

To choose from three configuration settings, install theeslint-config-lwc sharable configuration package.

Older browsers like IE11 run LWC in compatibility mode. For more information about browser performance, please refer toSupported Browsers in the Lightning Web Components Developer Guide.