wxt-dev / wxt

âš¡ Next-gen Web Extension Framework
https://wxt.dev
MIT License
3.2k stars 113 forks source link

Update generated ESLint config file for ESLint 9 #710

Open KnightYoshi opened 2 weeks ago

KnightYoshi commented 2 weeks ago

Feature Request

Update ESLint config to support the ESLint 9 structure.

What are the alternatives?

I have managed to get ESLint to recognize the WXT globals by importing it as:

import globals from 'globals';
import wxtimport from './.wxt/eslintrc-auto-import.json' assert { type: 'json' };

export default [
    {
        languageOptions: {
            globals: {
                ...globals.browser,
                ...wxtimport.globals,
            },
        },
    }

Additional context

ESLint 9 has deprecated the .eslintrc* files in favor of eslint.config.js, eslint.config.mjs, and eslint.config.cjs and changed the config structure

https://eslint.org/docs/latest/use/configure/configuration-files

Looked through how it's generated and got lost trying to follow the trail 🤣

aklinker1 commented 2 weeks ago

If you'd like to contribute this, here's the function that generates this code: https://github.com/wxt-dev/wxt/blob/34ea23030b932da7a66f0942d45025fd37bc236d/packages/wxt/src/core/utils/building/generate-wxt-dir.ts#L62-L77

You can test changes by running pnpm test auto-imports, specifically here are the tests that matter: https://github.com/wxt-dev/wxt/blob/34ea23030b932da7a66f0942d45025fd37bc236d/packages/wxt/e2e/tests/auto-imports.test.ts#L97

Seems like you can get the ESLint version via:

import { ESLint } from 'eslint';
ESLint.version

Then we should generate a different output for v9.

aklinker1 commented 2 weeks ago

Or, a much simpler alternative, just output a second file file along-side the existing file with the following content:

// .wxt/eslint-v9-config.js
import globals from 'globals';
import autoImports from './.wxt/eslintrc-auto-import.json' assert { type: 'json' };

export default {
    languageOptions: {
        globals: {
            ...globals.browser,
            ...autoImports.globals,
        },
    },
}

And tell people to extend that file for v9 and up. Eventually, I'd like to just generate one file, but this could be a non-breaking, short-term solution.

KnightYoshi commented 2 weeks ago

Thanks for pointing me in the right direction. I don't mind giving it a shot myself. I ended up in the getUnimportOptions function trying to find where it happens 🙃

I've looked at how the globals package does it, that package just has an index.js script that exports the globals.json file. I think we can do something similar here that way it's not backwards breaking.

I'll see about doing this a little later when I have some free