Linting

Linting provides errors about malformed code while you edit. VS Code enforces Salesforce’s ESLint rules.

Prerequisites

The active LTS release of Node.js built with SSL support.

Installation

For a New Project

If you create an SFDX project using the sf project:generate command, your project contains a package.json file with the ESLint plugin already included.

To install the ESLint plugin and other dependencies, run npm install in your project directory.
Configure the ESLint plugin rules (optional).
To run linting, you must have components in your project. To start linting, run npm run lint:lwc.

For an Existing Project

Verify that your project has a package.json with these configurations. If your package.json doesn’t have the configurations, run npm install eslint @salesforce/eslint-config-lwc --save-dev.

"scripts": {
    "lint": "npm run lint:lwc",
    "lint:lwc": "eslint force-app/main/default/lwc"
}

"devDependencies" {
    "@salesforce/eslint-config-lwc": "3.4.0",
    "eslint": "^5.16.0"
}

If your project doesn’t have the package.json file, copy it and add it to your project directory.
Verify that your project has this .eslintignore file. This file specifies which files not to lint. If your project doesn’t have it, add it to your project directory.
Verify that your project has this .eslintrc.json file. This file specifies your linting configuration level. If your project doesn’t have it, add it to your project directory.
To install the ESLint plugin and other dependencies, run npm install on your project directory.
To run linting, you must have components in your project. To start linting, run npm run lint:lwc.

Configure Linting Rules

ESLint includes three configuration levels. The default level is @salesforce/eslint-config-lwc/recommended.

To change the configuration level, edit this line in the .eslintrc.json

{
  "extends": ["@salesforce/eslint-config-lwc/recommended"]
}

@salesforce/eslint-config-lwc/base This configuration prevents common pitfalls with Lightning Web Components and enforces other Salesforce platform restrictions.
@salesforce/eslint-config-lwc/recommended This configuration prevents common Javascript pitfalls and enforces all best practices.
@salesforce/eslint-config-lwc/extended This configuration restricts the use of some Javascript language features that are sometimes slow in older browsers, such as IE11. To support new Javascript syntax and language features on an older browser, the Lightning Web Components compiler transforms the Lightning Web Components modules.

For more details on the linting rules and using them individually, see the ESLint Plugin Github repository.

Add Additional Scripts

The "scripts" section of package.json includes some scripts already pre-configured to run ESLint. To add your own, see the npm documentation.