feat: ESLint v9 (#151)

* feat!: update dependency to eslint v9 @W-17448473 (#141)

* feat!: update dependency to eslint v9 @W-17448473
BREAKING CHANGE: dropping support for ESLint v7 and v8. The only supported option is ESLint v9

* 4.0.0-beta.1

* fix: specify correct peer dependency versions for @lwc/eslint-plugin-lwc and @salesforce/eslint-plugin-lightning

* 4.0.0-beta.2

* fix: allow prerelease versions as peer dependencies

* 4.0.0-beta.3

* chore: export ts configs @W-17448452 (#146)

* 4.0.0-beta.4

* fix: add missing dependency (#147)

globals was being pulled in as a transitive dependency

* chore: update @lwc/eslint-plugin-lwc@3.0.0-beta.2

* 4.0.0-beta.5

---------

Co-authored-by: Ravi Jayaramappa <ravi.jayaramappa@salesforce.com>

Author: jmsjtu

.circleci/config.yml

@@ -1,6 +1,6 @@
 version: 2.1
 
-supported-eslint-versions: &supported-eslint-versions ['local', '7']
+supported-eslint-versions: &supported-eslint-versions ['local']
 
 executors:
     node:

.eslintrc

@@ -12,70 +12,100 @@ Note that `@lwc/eslint-plugin-lwc`, `@salesforce/eslint-plugin-lightning`, `esli
 
 ## Usage
 
-Add the appropriate [configuration](#Configurations) to the `extends` field in your configuration.
+> [!IMPORTANT]
+> Starting with v4.0.0, @salesforce/eslint-config-lwc only supports `eslint@v9`. Use `@salesforce/eslint-config-lwc@v3.x` for older versions of eslint.
+
+This repo exports the configurations as an array of config objects. [Apply](https://eslint.org/docs/latest/use/configure/combine-configs#apply-a-config-array) the appropriate [configuration](#Configurations) into your configuration using the spread operator.
+
+Example of `eslint.config.js`:
 
-Example of `.eslintrc`:
+```js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
 
-```json
-{
-    "extends": ["@salesforce/eslint-config-lwc/recommended"]
-}
+module.exports = [...lwcConfig.configs.recommended];
 ```
 
 For more details about configuration, please refer to the dedicated section in the ESLint documentation: https://eslint.org/docs/user-guide/configuring#using-a-shareable-configuration-package
 
 ### [Experimental] Usage with TypeScript
 
-To enable working with TypeScript projects, install `@babel/preset-typescript` as a dependency, and extend any of the TypeScript-enabled [configurations](#configurations) (any config ending in `-ts`).
+To enable working with TypeScript projects, install `@babel/preset-typescript` as a dependency, and apply any of the TypeScript-enabled [configurations](#configurations) (any config ending in `Ts`).
 
 Note that these configs use [@babel/eslint-parser](https://www.npmjs.com/package/@babel/eslint-parser), and compatibility with [@typescript-eslint/parser](https://npmjs.com/package/@typescript-eslint/parser) is not guaranteed.
 
 > [!IMPORTANT]
 > While these configs are capable of parsing TypeScript files, not all rules support all TypeScript language features. For example, using type assertions (`variable as Type`) will break many rules.
 
-Example `.eslintrc`:
+Example `eslint.config.js`:
 
-```json
-{
-    "extends": ["@salesforce/eslint-config-lwc/recommended-ts"]
-}
+```js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
+
+module.exports = [...lwcConfig.configs.recommendedTs];
 ```
 
 ## Configurations
 
-This package exposes multiple configurations for your usage. Each configuration listed below is available for both JavaScript projects and TypeScript projects (when using `-ts` suffix).
+This package exposes multiple configurations for your usage. Each configuration listed below is available for both JavaScript projects and TypeScript projects (when using `Ts` suffix).
 
-### `@salesforce/eslint-config-lwc/base`
+### Base
 
 **Goal:**
 Prevent common pitfalls with LWC, and enforce other Salesforce platform restrictions.
 
 **Rules:**
 [_LWC specific rules_](https://github.com/salesforce/eslint-plugin-lwc/blob/master/README.md#lwc) only.
 
-**TypeScript:** Use `@salesforce/eslint-config-lwc/base-ts` to use this config in TypeScript projects.
+**Usage:**
+
+```js
+// eslint.config.js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
+
+module.exports = [...lwcConfig.configs.base];
+```
 
-### `@salesforce/eslint-config-lwc/recommended`
+**TypeScript:** Use `configs.baseTs` to use this config in TypeScript projects.
+
+### Recommended`@salesforce/eslint-config-lwc/recommended`
 
 **Goal:**
 Prevent common Javascript pitfalls and enforce all best practices.
 
 **Rules:**
-`@salesforce/eslint-config-lwc/base` rules + Most of the base [_Potential errors_](https://eslint.org/docs/rules/#possible-errors) rules + Some of the [_Best Practices_](https://eslint.org/docs/rules/#best-practices) rules + [_LWC Best Practices_](https://github.com/salesforce/eslint-plugin-lwc/blob/master/README.md#best-practices).
+Base rules + Most of the base [_Potential errors_](https://eslint.org/docs/rules/#possible-errors) rules + Some of the [_Best Practices_](https://eslint.org/docs/rules/#best-practices) rules + [_LWC Best Practices_](https://github.com/salesforce/eslint-plugin-lwc/blob/master/README.md#best-practices).
+
+**Usage:**
+
+```js
+// eslint.config.js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
 
-**TypeScript:** Use `@salesforce/eslint-config-lwc/recommended-ts` to use this config in TypeScript projects.
+module.exports = [...lwcConfig.configs.recommended];
+```
 
-### `@salesforce/eslint-config-lwc/extended`
+**TypeScript:** Use `configs.recommendedTs` to use this config in TypeScript projects.
+
+### Extended
 
 **Goal:**
 Restrict usage of some Javascript language features known to be slow after the _COMPAT_ transformation. LWC runs in _COMPAT_ mode on older browsers (eg. IE11). To support new Javascript syntax and language features on older browser the LWC compiler transforms LWC modules. This linting configuration targets patterns known to be slow in _COMPAT_ mode.
 
 **Rules:**
-`@salesforce/eslint-config-lwc/recommended` rules + restrict usage of some slow patterns in [_COMPAT_](https://github.com/salesforce/eslint-plugin-lwc/blob/master/README.md#compat-performance).
+Recommended rules + restrict usage of some slow patterns in [_COMPAT_](https://github.com/salesforce/eslint-plugin-lwc/blob/master/README.md#compat-performance).
+
+**Usage:**
+
+```js
+// eslint.config.js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
 
-**TypeScript:** Use `@salesforce/eslint-config-lwc/extended-ts` to use this config in TypeScript projects.
+module.exports = [...lwcConfig.configs.extended];
+```
 
-### `@salesforce/eslint-config-lwc/i18n`
+**TypeScript:** Use `configs.extendedTs` to use this config in TypeScript projects.
+
+### i18n `@salesforce/eslint-config-lwc/i18n`
 
 **Goal:**
 Promote usage of `@salesforce/i18n-service` over 3rd parties, promote internationalization (I18N) best practices.
@@ -85,17 +115,18 @@ Promote usage of `@salesforce/i18n-service` over 3rd parties, promote internatio
 
 **Usage:**
 
-Add the `i18n` configuration to the `extends` field in your `.eslintrc` configuration file, for example:
+Add the `i18n` configuration to the `extends` field in your `eslint.config.js` configuration file, for example:
+
+```js
+// eslint.config.js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
 
-```json
-{
-    "extends": ["@salesforce/eslint-config-lwc/recommended", "@salesforce/eslint-config-lwc/i18n"]
-}
+module.exports = [...lwcConfig.configs.recommended, ...lwcConfig.configs.i18n];
 ```
 
-**TypeScript:** Use `@salesforce/eslint-config-lwc/i18n-ts` to use this config in TypeScript projects.
+**TypeScript:** Use `configs.i18nTs` to use this config in TypeScript projects.
 
-### `@salesforce/eslint-config-lwc/ssr`
+### Ssr
 
 **Goal:**
 Promote writing server-side-rendering friendly components. We only recommend using this configuration if your components are running in experiences supporting LWC server-side-rendering.
@@ -105,12 +136,11 @@ Promote writing server-side-rendering friendly components. We only recommend usi
 
 **Usage:**
 
-Add the `ssr` configuration to the `extends` field in your `.eslintrc` configuration file, for example:
+```js
+// eslint.config.js
+const lwcConfig = require('@salesforce/eslint-config-lwc');
 
-```json
-{
-    "extends": ["@salesforce/eslint-config-lwc/recommended", "@salesforce/eslint-config-lwc/ssr"]
-}
+module.exports = [...lwcConfig.configs.ssr];
 ```
 
-**TypeScript:** Use `@salesforce/eslint-config-lwc/ssr-ts` to use this config in TypeScript projects.
+**TypeScript:** Use `configs.ssrTs` to use this config in TypeScript projects.

README.md

@@ -6,10 +6,16 @@
  */
 'use strict';
 
-module.exports = {
-    extends: [
-        require.resolve('./base'),
-        // Must be second to override the default parser options
-        require.resolve('./lib/typescript'),
-    ],
-};
+const base = require('./base');
+const tsLanguageOptions = require('./lib/typescript');
+
+module.exports = [
+    ...base,
+    // The following config will take effect as explained in
+    // https://eslint.org/docs/latest/use/configure/configuration-files#cascading-configuration-objects
+    {
+        languageOptions: {
+            ...tsLanguageOptions,
+        },
+    },
+];

base-ts.js

@@ -6,6 +6,9 @@
  */
 'use strict';
 
+const eslintPluginLwc = require('@lwc/eslint-plugin-lwc');
+const languageOptions = require('./lib/defaults');
+
 const KNOWN_WIRE_ADAPTERS = [
     {
         module: 'lightning/**',
@@ -257,51 +260,53 @@ const WIRE_ADAPTERS_WITH_RESTRICTED_USE = [
     },
 ];
 
-module.exports = {
-    extends: [require.resolve('./lib/defaults')],
+module.exports = [
+    {
+        languageOptions,
 
-    plugins: [
-        '@lwc/eslint-plugin-lwc', // https://github.com/salesforce/eslint-plugin-lwc
-    ],
+        plugins: {
+            '@lwc/lwc': eslintPluginLwc, // https://github.com/salesforce/eslint-plugin-lwc
+        },
 
-    rules: {
-        // LWC lifecycle hooks validation
-        '@lwc/lwc/no-deprecated': 'error',
+        rules: {
+            // LWC lifecycle hooks validation
+            '@lwc/lwc/no-deprecated': 'error',
 
-        // LWC decorator validation
-        '@lwc/lwc/valid-api': 'error',
-        '@lwc/lwc/valid-track': 'error',
-        '@lwc/lwc/valid-wire': 'error',
+            // LWC decorator validation
+            '@lwc/lwc/valid-api': 'error',
+            '@lwc/lwc/valid-track': 'error',
+            '@lwc/lwc/valid-wire': 'error',
 
-        // LWC wire adapters validation
-        '@lwc/lwc/no-unknown-wire-adapters': [
-            'error',
-            {
-                adapters: KNOWN_WIRE_ADAPTERS,
-            },
-        ],
-        '@lwc/lwc/no-unexpected-wire-adapter-usages': [
-            'error',
-            {
-                adapters: WIRE_ADAPTERS_WITH_RESTRICTED_USE,
-            },
-        ],
+            // LWC wire adapters validation
+            '@lwc/lwc/no-unknown-wire-adapters': [
+                'error',
+                {
+                    adapters: KNOWN_WIRE_ADAPTERS,
+                },
+            ],
+            '@lwc/lwc/no-unexpected-wire-adapter-usages': [
+                'error',
+                {
+                    adapters: WIRE_ADAPTERS_WITH_RESTRICTED_USE,
+                },
+            ],
 
-        // LWC import validation
-        '@lwc/lwc/no-disallowed-lwc-imports': 'error',
+            // LWC import validation
+            '@lwc/lwc/no-disallowed-lwc-imports': 'error',
 
-        // Disable any direct importing of LDS artifacts generated by the LWC compiler
-        'no-restricted-imports': [
-            'error',
-            {
-                patterns: [
-                    {
-                        group: ['@salesforce/lds', '@salesforce/lds/**'],
-                        message:
-                            'Please do not import from @salesforce/lds, these modules are ephemeral and could change at any time.',
-                    },
-                ],
-            },
-        ],
-    },
-};
+            // Disable any direct importing of LDS artifacts generated by the LWC compiler
+            'no-restricted-imports': [
+                'error',
+                {
+                    patterns: [
+                        {
+                            group: ['@salesforce/lds', '@salesforce/lds/**'],
+                            message:
+                                'Please do not import from @salesforce/lds, these modules are ephemeral and could change at any time.',
+                        },
+                    ],
+                },
+            ],
+        },
+    },
+];

base.js

@@ -0,0 +1,18 @@
+'use strict';
+const globals = require('globals');
+const js = require('@eslint/js');
+module.exports = [
+    js.configs.recommended,
+    {
+        languageOptions: {
+            globals: {
+                ...globals.mocha,
+                ...globals.node,
+            },
+            sourceType: 'commonjs',
+        },
+        rules: {
+            strict: ['error', 'global'],
+        },
+    },
+];

eslint.config.js

@@ -6,10 +6,16 @@
  */
 'use strict';
 
-module.exports = {
-    extends: [
-        require.resolve('./extended'),
-        // Must be second to override the default parser options
-        require.resolve('./lib/typescript'),
-    ],
-};
+const tsLanguageOptions = require('./lib/typescript');
+const extended = require('./extended');
+
+module.exports = [
+    ...extended,
+    // The following config will take effect as explained in
+    // https://eslint.org/docs/latest/use/configure/configuration-files#cascading-configuration-objects
+    {
+        languageOptions: {
+            ...tsLanguageOptions,
+        },
+    },
+];

extended-ts.js

@@ -6,13 +6,16 @@
  */
 'use strict';
 
-module.exports = {
-    extends: [require.resolve('./recommended')],
+const recommended = require('./recommended');
 
-    rules: {
-        // LWC COMPAT performance restrictions
-        '@lwc/lwc/no-async-await': 'error',
-        '@lwc/lwc/no-for-of': 'error',
-        '@lwc/lwc/no-rest-parameter': 'error',
+module.exports = [
+    ...recommended,
+    {
+        rules: {
+            // LWC COMPAT performance restrictions
+            '@lwc/lwc/no-async-await': 'error',
+            '@lwc/lwc/no-for-of': 'error',
+            '@lwc/lwc/no-rest-parameter': 'error',
+        },
     },
-};
+];