fi3ework / vite-plugin-checker

💬 Vite plugin that provide checks of TypeScript, ESLint, vue-tsc, Stylelint and more.
https://vite-plugin-checker.netlify.app
MIT License
1.01k stars 88 forks source link

Incompatible with eslint@9 #320

Open jeron-diovis opened 6 months ago

jeron-diovis commented 6 months ago

Describe the bug

Build crashes when running with eslint@9 installed:

node:internal/event_target:1096
  process.nextTick(() => { throw err; });
                           ^
Error: Invalid Options:
- Unknown options: extensions, ignorePath, reportUnusedDisableDirectives, resolvePluginsRelativeTo, rulePaths, useEslintrc
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.
- 'ignorePath' has been removed.
- 'rulePaths' has been removed. Please define your rules using plugins.
- 'reportUnusedDisableDirectives' has been removed. Please use the 'overrideConfig.linterOptions.reportUnusedDisableDirectives' option instead.
    at processOptions (/path/to/proj/node_modules/eslint/lib/eslint/eslint-helpers.js:839:15)
    at new ESLint (/path/to/proj/node_modules/eslint/lib/eslint/eslint.js:593:34)
    at Object.configureServer (file:///path/to/proj/node_modules/vite-plugin-checker/dist/esm/checkers/eslint/main.js:73:18)
    at MessagePort.<anonymous> (file:///path/to/proj/node_modules/vite-plugin-checker/dist/esm/worker.js:57:26)
    at [nodejs.internal.kHybridDispatch] (node:internal/event_target:822:20)
    at MessagePort.<anonymous> (node:internal/per_context/messageport:23:28) {
  code: 'ESLINT_INVALID_OPTIONS'
}

Node.js v21.7.2
error Command failed with exit code 1.

Reproduction

  1. yarn add -D eslint@^9
  2. Run vite with configured vite-plugin-checker

Expected behavior

Build should not crash when eslint@9 is installed.

System Info

System:
    OS: macOS 14.4
    CPU: (10) arm64 Apple M1 Pro
    Memory: 495.78 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 21.7.2 - /usr/local/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 10.5.0 - /usr/local/bin/npm
    pnpm: 8.6.7 - /usr/local/bin/pnpm
    Watchman: 2024.01.22.00 - /usr/local/bin/watchman
  Browsers:
    Chrome: 124.0.6367.202
    Safari: 17.4
    Safari Technology Preview: 17.4

Additional context

No response

Validations

Pistil-Studio commented 6 months ago

if you use FLAT CONFIG, specify to checker

plugins: [
    checker({
      eslint: {
        useFlatConfig: true, // for me this fix the problem
        lintCommand: "eslint 'src/scripts/**/*.ts'", 
      },
    }),
  ],
vishal-kadmos commented 6 months ago

useFlatConfig is not working for me. Still getting same error

checker({
        typescript: true,
        eslint: {
          useFlatConfig: true,
          lintCommand: 'eslint "./src/**/*.{ts,tsx}"',
        },
        overlay: {
          initialIsOpen: false,
        },
      }),

dependencies

"vite-plugin-checker": "^0.6.4",
"eslint": "^9.3.0",
ilxqx commented 5 months ago

Same issue.

tryforceful commented 5 months ago

Try now using "vite-plugin-checker": "0.7.0" @vishal-kadmos

felixranesberger commented 4 months ago

Any updates?

MartinX3 commented 3 months ago

It doesn't work with the ESLint 9.9.0 eslint.config.ts.

Using dev: { overrideConfig: { flags: ['unstable_ts_config'] } }, it simply ignores the flag. Using lintCommand: 'eslint --flag unstable_ts_config' it says "unknown --flag, do I mean --fix?"

Edit: Looking into the code the typing says there is a flags, but in the code it is not used for eslint. Only for the others like biome.

Seeing https://github.com/fi3ework/vite-plugin-checker/blob/b2c32367cf2e410154194d7730d8830aace898d9/packages/vite-plugin-checker/src/checkers/eslint/main.ts#L76C1-L78C13 Instead of

eslint = new FlatESLint({
    cwd: root,
})

it should be as example for a hardcoded flag

eslint = new FlatESLint({
    cwd: root,
    flags: ['unstable_ts_config']
});

sooo there is the interpreting of the flags option completely missing.

And for the buildmode it needs fixes here https://github.com/fi3ework/vite-plugin-checker/blob/b2c32367cf2e410154194d7730d8830aace898d9/packages/vite-plugin-checker/src/checkers/eslint/main.ts#L171-L179

Because the mentioned eslint.dev.eslint in the docs doesn't seem to exist for eslint. Only for biome.

buggedcom commented 1 month ago

It gets a bit more complicated as the options that are being sanitised aren't compatible between the two. I've started work on trying to fix this, but still running into issues. Here are my forked changes but they are not ready yet to get it to work

 Error [ConfigError]: Config (unnamed): Key "env": This appears to be in eslintrc format rather than flat config format.
[0]     at rethrowConfigError (xxx/node_modules/@eslint/config-array/dist/cjs/index.cjs:303:8)
[0]     at xxx/node_modules/@eslint/config-array/dist/cjs/index.cjs:1098:5
[0]     at Array.reduce (<anonymous>)
[0]     at FlatConfigArray.getConfigWithStatus (xxx/node_modules/@eslint/config-array/dist/cjs/index.cjs:1091:43)
[0]     ... 2 lines matching cause stack trace ...
[0]     at async NodeHfs.<anonymous> (file:///xxx/node_modules/@humanfs/core/src/hfs.js:574:24)
[0]     at async NodeHfs.walk (file:///xxx/node_modules/@humanfs/core/src/hfs.js:614:3)
[0]     at async globSearch (xxx/node_modules/eslint/lib/eslint/eslint-helpers.js:327:26)
[0]     at async Promise.allSettled (index 0)

https://github.com/fi3ework/vite-plugin-checker/compare/main...buggedcom:vite-plugin-checker:main

MartinX3 commented 1 month ago

I didn't fix the issue but hardcoded the flag via a pnpm patch:

# TODO WORKAROUND UNTIL https://github.com/fi3ework/vite-plugin-checker/issues/320 IS RESOLVED
diff --git a/dist/cjs/checkers/eslint/main.js b/dist/cjs/checkers/eslint/main.js
index 7d08eef00a69b3089d0710d40b84de2cf0fd1f0d..a328789395d5f838c97342bd5ad3ae6b5a5ab70e 100644
--- a/dist/cjs/checkers/eslint/main.js
+++ b/dist/cjs/checkers/eslint/main.js
@@ -94,7 +94,8 @@ const createDiagnostic = (pluginConfig) => {
         } = require2("eslint/use-at-your-own-risk");
         if (shouldUseFlatConfig == null ? void 0 : shouldUseFlatConfig()) {
           eslint = new FlatESLint({
-            cwd: root
+            cwd: root,
+            flags: ['unstable_ts_config']
           });
         } else {
           throw Error(
@@ -177,9 +178,9 @@ class EslintChecker extends import_Checker.Checker {
         buildBin: (pluginConfig) => {
           if (pluginConfig.eslint) {
             const { lintCommand } = pluginConfig.eslint;
-            return ["eslint", lintCommand.split(" ").slice(1)];
+            return ["eslint --flag unstable_ts_config", lintCommand.split(" ").slice(1)];
           }
-          return ["eslint", [""]];
+          return ["eslint --flag unstable_ts_config", [""]];
         }
       },
       createDiagnostic
diff --git a/dist/esm/checkers/eslint/main.js b/dist/esm/checkers/eslint/main.js
index 2088f4de71ef1d02f1fad6f4b5a616f649b257bc..af3587ea7cab6410d60e616e81534b0a36446502 100644
--- a/dist/esm/checkers/eslint/main.js
+++ b/dist/esm/checkers/eslint/main.js
@@ -67,7 +67,8 @@ const createDiagnostic = (pluginConfig) => {
         } = require2("eslint/use-at-your-own-risk");
         if (shouldUseFlatConfig == null ? void 0 : shouldUseFlatConfig()) {
           eslint = new FlatESLint({
-            cwd: root
+            cwd: root,
+            flags: ['unstable_ts_config']
           });
         } else {
           throw Error(
@@ -150,9 +151,9 @@ class EslintChecker extends Checker {
         buildBin: (pluginConfig) => {
           if (pluginConfig.eslint) {
             const { lintCommand } = pluginConfig.eslint;
-            return ["eslint", lintCommand.split(" ").slice(1)];
+            return ["eslint --flag unstable_ts_config", lintCommand.split(" ").slice(1)];
           }
-          return ["eslint", [""]];
+          return ["eslint --flag unstable_ts_config", [""]];
         }
       },
       createDiagnostic
Atralbus commented 3 weeks ago

I'm not sure if it's related, but I was using this library with ESLint v8.57.1 without issues. However, when I switched to v9.13.0 with the flat config, it stopped updating lint errors on hot reload.