eslint-config-prettier icon indicating copy to clipboard operation
eslint-config-prettier copied to clipboard

Compatibility with new eslint config spec

Open jjangga0214 opened this issue 2 years ago • 2 comments

Eslint announced a new config spec. https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new

스크린샷 2022-09-09 오후 10 07 49

According to eslint's official blog, though backward compatibility was taken care of, not all shareable configs continue to work with the new config system.

Is eslint-config-prettier compatible with the new config?

Thanks.

jjangga0214 avatar Sep 09 '22 13:09 jjangga0214

I tried it out quickly, and in short: Yes, it works. But there are some things to do as well.

eslint.config.js:

import prettier from "eslint-config-prettier";

export default [
    "eslint:recommended",
    prettier,
];

The above successfully disables the no-mixed-spaces-and-tabs rule from eslint:recommended! 🎉

And this:

import prettier from "eslint-config-prettier";

export default [
    {
        rules: {
            semi: "error",
        }
    },
    prettier,
];

The above successfully turns off the semi rule. 🎉 Even though semi wasn’t set by another config. This wasn’t possible before.

However, the CLI helper tool does not work:

❯ npx eslint-config-prettier index.js
No ESLint configuration found in /Users/lydell/stuff/eslint.

TODO:

  • [x] Make the CLI helper tool work and make sense with the new config format.
  • [x] Update documentation with examples of both old and new format.
  • [x] Make it clear in the documentation that you need to put prettier after things that you want to override, and that it can “win” over not just other configs but also your own config (as mentioned above).

However, it might be too early days to do this just yet: https://github.com/eslint/eslint/issues/13481

lydell avatar Sep 09 '22 15:09 lydell

Changing this line:

https://github.com/prettier/eslint-config-prettier/blob/a57a3bb0e5aa39f59c2523bb3b77bf7e13b7be2a/bin/cli.js#L11

-const { ESLint } = require(require.resolve("eslint", {
+const { FlatESLint: ESLint } = require(require.resolve("eslint/use-at-your-own-risk", {

… seems to make the CLI work with the new config system. However, that is still an unsupported API, and I need to figure out how to support both the old and new config systems at the same time.

I think the conclusion for now is:

  • The main part of eslint-config-prettier works already with the new config system.
  • Early adopters can find this issue for information.
  • Let’s wait for ESLint to progress more. The above experiment indicates that we should be able to make the CLI work without too much effort when the time comes.

lydell avatar Sep 09 '22 20:09 lydell

Unless I'm doing something wrong it does not seem to work anymore 😕

Oops! Something went wrong! :(

ESLint: 8.44.0

TypeError: Cannot read properties of undefined (reading 'includes')
    at /home/theo/dev/fem-kanban/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/eslint-plugin-prettier/worker.js:116:27

theoparis avatar Jul 09 '23 07:07 theoparis

The updated CLI tool was released in v9.0.0.

The docs and tests have been updated too.

lydell avatar Aug 05 '23 19:08 lydell