feat: update project to support eslint9 and flat configs #373

tagoro9 · 2025-01-28T15:52:16Z

Description

This PR updates the project to be compatible with eslint v9 and flat configurations.

It introduces several breaking changes:

Minimum node version is 20. This wasn't strictly needed but why not.
Consolidate all sort like plugins into just https://github.com/azat-io/eslint-plugin-perfectionist - one of the plugins we were using was no longer maintained and didn't support eslint v9
Remove the legacy config preset. It's only used in a few internal repos and they should be able to update easily

Apart from this I made other features / changes:

Add support for eslint to lint this repo using the config in this repo. The applied rules are limited (see below in open questions)
Add support for the project to work both with ESM and CJS. It seems ESM support is much better now, so it would be good to start supporting it in more places
Update the tests to check for lint errors instead of the config eslint determines (the snapsthots were quite big and with 3 configs it was hard to read)

Getting the grasp of the new config setup took a while but it feels a lot more flexible.

TODOs

Test this in a few more repos
Add instructions to the update file for how to move from eslintrc configs into eslint.config.js configs

Open questions

Should we support non flat configs or just deprecate everything and leave just the flat configuration?
Should we drop support for eslint 8? It's in EOL already but left it just in case
Should we suppport CJS or just go with ESM? Eslint supports this natively so it wouldn't conflict an actual project code and would simplify things in this repo
If we drop support for eslint 8, should we also drop the recommended legacy config preset?
eslint v9 no longer has the --ext option and we have to use the files option to tell it what files to lint. Should we tell it to lint also js and jsx extensions? This would allow to lint this repo better or any repo where there is still JS code
Should we explore using TS here to define the configurations? We would get better typing and a bit of overhead for building it
Should we establish any naming convention for the imports of other libraries in the new config files? I used <tool>Plugin as the variable name but open to any

How has this been tested

Via unit tests to ensure all presets work
By running the config in this repo
In some internal repos locally installing the config via yalc

Changes

feat: replace sort plugins with eslint-plugin-perfectionist
feat: update required min node version to 20
feat: add flat configs, use eslint 9 and remove legacy preset
ci: add lint script
test: add test for all the config flavors
docs: udpate readme and add breaking changes doc

🚀 PR created with fotingo

index.mjs

tagoro9 · 2025-01-28T16:00:27Z

index.mjs

+
+export default tseslint.config(
+  {
+    files: ["**/*.ts", "**/*.tsx"],


This is what I mention in the PR. This is the replacement of the -- ext option. Maybe we should include here *.js and *.jsx?

We may need a separate configuration for *.js files that doesn't include the TS plugins

I'll try on a JS project to see what happens. It might just work fine. In this repo I had to add some tweaks for the default config so it could pick them

We have a separate eslint config repo for *.js, right?
Although I guess the point is that in TS projects we may have .js files,... So I guess we could try adding them here and if there are problems, adding a separate config as Esau mentions

We have a separate eslint config repo for *.js, right?

We do, but that project is not used at all as we don't have any JS only project

I'll play with things and see if it works!

We do, but that project is not used at all as we don't have any JS only project

web-schumacher-app still relies on it for .js!

Toolo · 2025-01-28T16:28:47Z

index.mjs

+
+export default tseslint.config(
+  {
+    files: ["**/*.ts", "**/*.tsx"],


We may need a separate configuration for *.js files that doesn't include the TS plugins

Toolo · 2025-01-28T16:31:39Z

package.json

-    "lint": "echo noop",
-    "test": "jest ./test/test.spec.js"
+    "lint": "eslint './*.{cjs,mjs}' test/test.spec.js",
+    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js"


Jest is still the biggest blocker for ESM... 😞

docs/breaking-changes/v15.md

romenrg

LGTM. I remember the legacy preset being used by several repos, but I guess it is ok to remove it in this new version and force those repos to be updated to the new default preset when bumping the dependency.

romenrg · 2025-01-29T19:29:18Z

index.mjs

+
+export default tseslint.config(
+  {
+    files: ["**/*.ts", "**/*.tsx"],


We have a separate eslint config repo for *.js, right?
Although I guess the point is that in TS projects we may have .js files,... So I guess we could try adding them here and if there are problems, adding a separate config as Esau mentions

BREAKING CHANGE: Several plugins with configs for sorting things have been replaced with eslint-plugin-perfectionist to consolidate plugins and better support the migration to eslint 9.

BREAKING CHANGE: Minimum required node version is 20

BREAKING CHANGE: The legacy preset no longer exists, non flat configs are still supports but require changes in the consumer

use eslint to lint the eslint config

remove snapshot in favor of checking that there are no lint errors

tagoro9 · 2025-02-14T01:56:53Z

index.mjs

While trying to integrate this with the react plugin, I realized that I was using the files setting wrong. The configs should use files as little as possible, except for when it's really needed. There are plugins that work with both JS and TS and we are now limiting them to just TS.

There are plugins like jest, that might need to be split into 2: JS and TS tests, as there are particular rules that require type checkers to be present

consolidate files into a single one

…nctions

github-actions · 2025-02-24T16:44:52Z

Prerelease build

Build version: 16.0.0-pr-373.11.1.1
Docker image: ``

Build output

github-actions · 2025-02-24T16:45:46Z

Release notes preview

Below is a preview of the release notes if your PR gets merged.

16.0.0 (2025-02-24)

⚠ BREAKING CHANGES

The legacy preset no longer exists, non flat configs
are still supports but require changes in the consumer
Minimum required node version is 20
Several plugins with configs for sorting things have
been replaced with eslint-plugin-perfectionist to consolidate plugins
and better support the migration to eslint 9.

Features

add flat configs, use eslint 9 and remove legacy preset (8fef88a)
convert the export into a function with some options (8d77a58)
make default config a function and split config into smaller functions (71c374d)
replace sort plugins with eslint-plugin-perfectionist (3808b19)
update required min node version to 20 (30bba2d)

Tests

add test for all the config flavors (7e5d775)

Continuous Integration

add lint script (43678fe)
add prerelease workflow (72896d2)

Build System

use node 22 locally (5806453)

Documentation

add missing env var requirement for legacy configs (3eaf04b)
udpate readme and add breaking changes doc (09c7012)

Breaking changes file `docs/breaking-changes/v16.md`

Breaking changes in v16

Minimum Node.js version

The minimum Node.js supported version is now ^20.

Removed plugins

The following plugins are getting replaced by eslint-plugin-perfectionist:

If you were reconfiguring some of the rules from these plugins in your eslint config you will have to update them and reference
the equivalent rule from https://perfectionist.dev/rules.

Removed legacy preset

The legacy preset is removed, as it only existed for some internal turo projects. Maintaining it to support eslint v9
was not worth the effort.

Default flat configuration

The default configuration for this package is now a flat eslint configuration. Read the
eslint guide for how to update legacy configurations
to flat configs.

The legacy configuration is still supported. To keep using it, you just have to update the .eslintrc file to:

{
--  "extends": "@open-turo/eslint-config-typescript"
++  "extends": "@open-turo/eslint-config-typescript/recommended"
}

If you are using legacy configurations, you will have to set the ESLINT_USE_FLAT_CONFIG env var to true.

Updating to flat configuration

If you wish to update to a flat configuration, you will have to make the following changes (please refer to the above guide
for all the details).

Move from .eslintrc (or equivalent file) into eslint.config.js (or equivalent file).
If you have a .eslintignore file, replace that into the ignores section of the eslint.config.js file

A .eslintignore file like this:

/lib

Will become a eslint.config.js file like this:

const turoConfig = require("@open-turo/eslint-config-typescript");

module.exports = [
  ...turoConfig,
  {
    ignores: ["/lib"],
  },
];

tagoro9 · 2025-02-24T16:49:00Z

index.cjs

@@ -0,0 +1,219 @@
+const eslint = require("@eslint/js");


I did a big refactor of this. Starting this thread so it's easier to add feedback.

We now have a single definition of everything. The mjs file just imports this one

The default export is no longer a flat config, but a function. The function takes in a few parameters. This makes it easier for a consumer to tweak some settings without having to tell what plugins are in use. See above how I disabled typescript for eslint in this repo. This will open it up to putting in here configs we have in other repos today (like the JS config)

I broke down the config into smaller grouped functions as it makes it easier to read. This also creates small differences with the non flat config, as rules plugins like prettier, unicorn or eslint affect all the files and not just TS files. I think this is ok.

brantphoto · 2025-03-05T21:41:09Z

test/test.spec.js

+        parserOptions,
+      },
+      overrideConfigFile: "./recommended.cjs",
+    });


at least locally I was able to get decent rule snapshot like this

const calculatedConfig = await linter.calculateConfigForFile("./test/sample.ts"); expect(calculatedConfig.rules).toMatchSnapshot();

I tested changing some @typescript-eslint rules, some sonar rules and it seemed to catch the changes. Maybe it'll work for us?

You are right the snapshot just contains the rules. I don't know what I was testing when I saw odd snapshots and it also works with flat configs

I still wonder. Should this be a test or should this be a helper to help see what rules are affecting a file when the config is in use?

I can see good things and some friction with having the rules in the snapshot:

Is a 1000 line snapshot valuable? There would be 3 1k line snapshots. Does it provide any value on its own? Probably not. But it can be valuable as a way to tell what has changed between 2 configs

Any dependency update may require updating the snapshot for any new rule they add / change even if the change is backwards compatible

With flat configs, I think the snapshot will not capture all rules, since we are running it on a specific file extension and now configs can target different types of files and it will require more long snapshots

We can add it and see if it has value long term or not

I would defer to your judgement.

mainly, will try to shed light on the problem statement: In my case, I was looking to change a 'org-wide' default and found that I couldn't parse which eslint-config the rule originated from. The snapshot came to me as an idea to at least get some visibility of the rule output of each config. If I was tracking down again, I could find the rule via searching github.

Other use case might be to get a feel for the scope of changes in major version plugin updates, to help digest the downstream effects.

tagoro9 requested a review from a team as a code owner January 28, 2025 15:52

tagoro9 requested review from michaeljaltamirano, OmarJaroudi and Toolo January 28, 2025 15:52

tagoro9 commented Jan 28, 2025

View reviewed changes

Toolo approved these changes Jan 28, 2025

View reviewed changes

tagoro9 force-pushed the f/eslint_v9 branch from 4d8e28f to 98178d9 Compare January 28, 2025 17:35

romenrg approved these changes Jan 29, 2025

View reviewed changes

tagoro9 force-pushed the f/eslint_v9 branch 3 times, most recently from a1262e4 to 776e688 Compare February 1, 2025 00:06

tagoro9 added the prerelease label Feb 1, 2025

tagoro9 force-pushed the f/eslint_v9 branch from 776e688 to 3a6e634 Compare February 1, 2025 00:09

open-turo deleted a comment from github-actions bot Feb 1, 2025

tagoro9 added 2 commits February 13, 2025 19:59

feat: replace sort plugins with eslint-plugin-perfectionist

3808b19

BREAKING CHANGE: Several plugins with configs for sorting things have been replaced with eslint-plugin-perfectionist to consolidate plugins and better support the migration to eslint 9.

feat: update required min node version to 20

30bba2d

BREAKING CHANGE: Minimum required node version is 20

tagoro9 force-pushed the f/eslint_v9 branch from 747b437 to 6bd9150 Compare February 13, 2025 20:00

open-turo deleted a comment from github-actions bot Feb 13, 2025

tagoro9 force-pushed the f/eslint_v9 branch from 6bd9150 to 4a65262 Compare February 13, 2025 22:49

open-turo deleted a comment from github-actions bot Feb 13, 2025

tagoro9 added 6 commits February 14, 2025 01:44

feat: add flat configs, use eslint 9 and remove legacy preset

8fef88a

BREAKING CHANGE: The legacy preset no longer exists, non flat configs are still supports but require changes in the consumer

ci: add lint script

43678fe

use eslint to lint the eslint config

test: add test for all the config flavors

7e5d775

remove snapshot in favor of checking that there are no lint errors

docs: udpate readme and add breaking changes doc

09c7012

ci: add prerelease workflow

72896d2

build: use node 22 locally

5806453

tagoro9 force-pushed the f/eslint_v9 branch from 4a65262 to 5806453 Compare February 14, 2025 01:44

open-turo deleted a comment from github-actions bot Feb 14, 2025

tagoro9 commented Feb 14, 2025

View reviewed changes

feat: convert the export into a function with some options

8d77a58

consolidate files into a single one

open-turo deleted a comment from github-actions bot Feb 20, 2025

open-turo deleted a comment from github-actions bot Feb 22, 2025

feat: make default config a function and split config into smaller fu…

71c374d

…nctions

tagoro9 force-pushed the f/eslint_v9 branch from 1e73960 to 71c374d Compare February 24, 2025 16:23

open-turo deleted a comment from github-actions bot Feb 24, 2025

docs: add missing env var requirement for legacy configs

3eaf04b

open-turo deleted a comment from github-actions bot Feb 24, 2025

tagoro9 requested a review from Toolo February 24, 2025 16:45

tagoro9 commented Feb 24, 2025

View reviewed changes

tagoro9 mentioned this pull request Feb 24, 2025

feat: update to eslint v9 and flat configs open-turo/eslint-config-react#320

Draft

3 tasks

brantphoto reviewed Mar 5, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: update project to support eslint9 and flat configs #373

feat: update project to support eslint9 and flat configs #373

tagoro9 commented Jan 28, 2025 •

edited

Loading

tagoro9 Jan 28, 2025

Toolo Jan 28, 2025

tagoro9 Jan 28, 2025

romenrg Jan 29, 2025

tagoro9 Jan 29, 2025

michaeljaltamirano Jan 29, 2025

Toolo Jan 28, 2025

Toolo Jan 28, 2025

romenrg left a comment

romenrg Jan 29, 2025

tagoro9 Feb 14, 2025

github-actions bot commented Feb 24, 2025

github-actions bot commented Feb 24, 2025 •

edited

Loading

tagoro9 Feb 24, 2025

brantphoto Mar 5, 2025

tagoro9 Mar 5, 2025

tagoro9 Mar 6, 2025

brantphoto Mar 6, 2025

feat: update project to support eslint9 and flat configs #373

Are you sure you want to change the base?

feat: update project to support eslint9 and flat configs #373

Conversation

tagoro9 commented Jan 28, 2025 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

romenrg left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

github-actions bot commented Feb 24, 2025

Prerelease build

github-actions bot commented Feb 24, 2025 • edited Loading

Release notes preview

16.0.0 (2025-02-24)

⚠ BREAKING CHANGES

Features

Tests

Continuous Integration

Build System

Documentation

Breaking changes file docs/breaking-changes/v16.md

Breaking changes in v16

Minimum Node.js version

Removed plugins

Removed legacy preset

Default flat configuration

Updating to flat configuration

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

tagoro9 commented Jan 28, 2025 •

edited

Loading

github-actions bot commented Feb 24, 2025 •

edited

Loading

Breaking changes file `docs/breaking-changes/v16.md`