Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Install the Komaci Static Analyzer

The Komaci static analyser is an ESLint plugin that you install using a package manager, such as NPM or Yarn.

Use Terminal (or your command line tool of choice) to run all commands from the root directory of your Lightning web components project.

Note

  1. Add the Komaci Static Analyzer plugin and its dependencies to the development dependencies of your project.
    NPM
    1npm install --save-dev @salesforce/eslint-plugin-lwc-graph-analyzer
    YARN
    1yarn add --dev @salesforce/eslint-plugin-lwc-graph-analyzer
  2. Install all project modules and dependencies locally in the project.
    NPM
    1npm install
    YARN
    1yarn install
  3. Configure your project to use the new plugin.
    Configuration depends on your ESLint version. Add your configuration at the root directory of your LWC "tree", which by default resides at force-app/main/default/lwc/.
    ESLint 9 and later (Flat Config)

    Use the recommended config in your eslint.config.js and eslint.config.mjs file.

    eslint.config.js

    1// eslint.config.js
    2                        const { defineConfig } = require("eslint/config");
    3                        const lwcGraphAnalyzerPlugin = require("@salesforce/eslint-plugin-lwc-graph-analyzer");
    4                        
    5                        module.exports = defineConfig([
    6                        {
    7                        plugins: {
    8                        "@salesforce/lwc-graph-analyzer": lwcGraphAnalyzerPlugin,
    9                        },
    10                        extends: [lwcGraphAnalyzerPlugin.configs.recommended],
    11                        },
    12                        ]);

    eslint.config.mjs

    1// eslint.config.mjs
    2                        import js from '@eslint/js';
    3                        import lwcGraphAnalyzerPlugin from '@salesforce/eslint-plugin-lwc-graph-analyzer';
    4                        
    5                        export default [
    6                        { 
    7                        plugins: { 
    8                        '@salesforce/lwc-graph-analyzer': lwcGraphAnalyzerPlugin 
    9                        }
    10                        },
    11                        js.configs.recommended,
    12                        lwcGraphAnalyzerPlugin.configs.recommended
    13                        ];
    ESLint 8 and earlier (Legacy Config)

    The configurations for legacy ESLint are now found in extensions with the -legacy suffix. An example of this is the following .eslintrc.json file, which sets up the eslint-plugin-lwc-graph-analyzer plugin using the recommended-legacy configuration:

    1{
    2    "extends": ["eslint:recommended", "plugin:@salesforce/lwc-graph-analyzer/recommended-legacy"]
    3}

    If you have an .eslintignore configuration in your project, do not add an entry to ignore HTML files. This causes the plugin to skip linting on LWC bundles that include HTML templates. There are a number of Komaci-based static analysis rules that apply specifically to the HTML template of a Lightning web component bundle.

    Note