ESLint

ESLint is a popular linting tool for JavaScript, TypeScript, and LWC. It provides numerous static-analysis rules that help developers write quality code.

Code Analyzer v5 currently supports both ESLint v8 and v9. Unless specifically called out, the rest of this topic assumes you're using the v9 ESLint configuration.

Run this command to view detailed information about all the ESLint rules that are bundled with Code Analyzer:

For details about the bundled rules, see:

• ESLint rules for JavaScript
• TypeScript-ESLint rules for TypeScript
• ESLint-LWC rules for JavaScript Lightning Web Components

For information on how to modify the settings of these bundled ESLint rules, such as their severity or tags, see Customize Your Configuration.

ESLint itself, outside of the Code Analyzer context, is highly configurable. For example, you can disable rules, change whether an existing rule is a warning or an error, add custom rules, and more. You typically use a configuration file to change the configuration. ESLint provides many options for the name of the configuration file, but for simplicity, this document assumes it's called eslint.config.js.

By default, Code Analyzer doesn't use your ESLint config file because it can conflict with the base configuration of the bundled rules. If you want to apply your ESLint config file, then either directly specify it with the eslint_config_file option or set the auto_discover_eslint_config option to true in your Code Analyzer configuration file. This example shows how to configure the file using an absolute path; you can also specify its location relative to the config_root top-level option:

Alternatively, you can specify that Code Analyzer dynamically find the ESLint configuration file:

If Code Analyzer finds an ESLint config file, it automatically attempts to merge it with base configurations associated with the built-in rules. Let's look at a few examples to see how this works.

• You update your eslint.config.js configuration file and change an existing ESLint rule to be an error rather than a warning. Code Analyzer honors this change and reflects the new severity; you can see this change by running sf code-analyzer rules --rule-selector eslint:RuleName. As with all Code Analyzer rules, you can then override this severity by updating the code-analyzer.yml file.
• You add a custom ESLint rule, Code Analyzer automatically adds it to the list of ESLint rules that you can view and run. And you can then modify the settings of this custom rule, such as its severity or tags, just like you can modify all the other rules that Code Analyzer knows about.

Here are additional details about how Code Analyzer automatically attempts to merge its base ESLint configuration with an ESLint configuration file that it finds in your workspace.

The ESLint v9 flat configuration is essentially an array of configuration objects. When Code Analyzer finds an ESLint configuration file, it appends the objects in the file to the base Code Analyzer configuration objects. If within this array, one of your configuration objects references a plugin that's also referenced by one of Code Analyzer's base configuration objects, then Code Analyzer attempts to resolve the potential conflict using this strategy:

• If the version of the plugin referenced by Code Analyzer's base config is greater than or equal to the version of the same plugin referenced by your configuration, then your configuration's plugin is replaced with Code Analyzer's.
• If the version of the plugin referenced by Code Analyzer's base config is less than the version of the same plugin referencd in your configuration, then the plugin in the base Code Analyzer configuration is replaced with yours.

This strategy resolves most conflicts, but it doesn’t always work. If you find an eslint engine error associated with your configuration, then you can disable Code Analyzer's base configuration and use only your own. Do this by setting the appropriate disable_*_base_config option to true in your code-analyzer.yml file.

For example, set disable_lwc_base_config to true to disable the base LWC rules for JavaScript files.

As discussed in the ESLint documentation, ESLint v9 introduced a new configuration file called eslint.config.js that has a different format from the legacy (v8) file (.eslintrc.json), which is now deprecated. Code Analyzer, however, currently supports both ESLint v8 and v9. Read on to learn how Code Analyzer determines which ESLint version to use.

In general, if Code Analyzer detects legacy v8 ESLint configuration files, it uses ESLint v8 to run the eslint rules. If it finds the new v9 flat configuration files, it uses ESLint v9 instead. If no ESLint configuration files are found, Code Analyzer defaults to using ESLint v9.

But depending on whether you're using a code-analyzer.yml file, and have set values for the eslint engine options in the file, then these general rules might not apply. Here's a breakdown of the different scenarios.

Scenarios:

• You don't use a code-analyzer.yml configuration file

  If you aren't using a code-analyzer.yml file, Code Analyzer defaults to using ESLint v9 to run the eslint rules, even if you have legacy v8 ESLint configuration files in your workspace. This happens because, without a code-analyzer.yml file, the auto_discover_eslint_config option defaults to false, which means that Code Analyzer doesn't search for or apply any ESLint configuration files in your workspace.

• You do use a code-analyzer.yml configuration file

  If you're using a code-analyzer.yml file, then there are a few different scenarios to determine whether Code Analyzer uses ESLint v8 or v9.

  • You set the auto_discover_eslint_config option to true. Here's how Code Analyzer determines which ESLint version to use, in order:

    • If Code Analyzer discovers a legacy (v8) file (such as .eslintrc.json), then it uses ESLint v8.
    • If Code Analyzer discovers a new (v9) flat config file (such as eslint.config.js), then it uses ESLint v9. Code Analyzer ignores any .eslintignore files.
    • If Code Analyzer doesn't find any configuration files, but finds a legacy .eslintignore file, then it uses ESLint v8.
    • If Code Analyzer doesn't find any configuration files or a .eslintignore file, then it uses ESLint v9.

  • You set the eslint_config_file to an ESLint configuration file.

    • If you set it to a legacy (v8) file, such as .eslintrc.json, then Code Analyzer uses ESLint v8.
    • If you set it to a new (v9) flat file, such as eslint.config.js, then Code Analyzer uses ESLint v9.

  • You set the eslint_ignore_file to an ignore file (used only in v8) and eslint_config_file to null.

    • Code Analyzer uses ESLint v8.

You can configure the ESLint engine with the settings listed in this table. See Customize the Configuration for details on how to apply the settings.