[✨] feat: add support for eslint flat config - eslint-plugin-qwik

[TheElegantCoding]

Please add support for ESLint 9, including Flat config support.

See:

• https://eslint.org/docs/latest/use/configure/configuration-files-new
• https://eslint.org/blog/2022/08/new-config-system-part-1/
• https://eslint.org/blog/2022/08/new-config-system-part-2/
• https://eslint.org/docs/latest/use/configure/migration-guide

Thanks!

[devcaeg]

I am using flat config from ESLint several months ago, and this is my configuration with Qwik, so far it works correctly.

eslint.config.js

import typescriptPlugin from '@typescript-eslint/eslint-plugin';
import typescriptParser from '@typescript-eslint/parser';
import prettierPlugin from 'eslint-plugin-prettier';
import qwikPlugin from 'eslint-plugin-qwik';
import globals from 'globals';

/** @type {import('eslint').Linter.FlatConfig[]} */
export default [
  {
    files: ['src/**/*.ts*'],
    languageOptions: {
      globals: {
        ...globals.node,
      },
      parser: typescriptParser,
      parserOptions: {
        ecmaFeatures: {
          jsx: true,
        },
        ecmaVersion: 'latest',
        project: ['./tsconfig.json'],
        sourceType: 'module',
        tsconfigRootDir: import.meta.dir,
      },
    },
    plugins: {
      '@typescript-eslint': typescriptPlugin,
      prettier: prettierPlugin,
      qwik: qwikPlugin,
    },
    rules: {
      ...prettierPlugin.configs.recommended.rules,
      ...qwikPlugin.configs.recommended.rules,
      ...typescriptPlugin.configs['strict-type-checked'].rules,
      ...typescriptPlugin.configs['stylistic-type-checked'].rules,
    },
  },
];

[TheElegantCoding]

yes this kind of work but the types are not well defined

[TheElegantCoding]

update this is the error the package has no support for typescript, te export is any

[mrcaidev]

Temporary workaround: use ESLint official FlatCompat.

pnpm add -D @eslint/eslintrc

// eslint.config.js
import { FlatCompat } from "@eslint/eslintrc";

const compat = new FlatCompat({
  baseDirectory: import.meta.dirname,
});

export default [
  // other configs
  ...compat.extends("plugin:qwik/recommended")
];

[wmertens]

@JerryWu1234 how about this one?

[JerryWu1234]

@JerryWu1234 how about this one?

I can do it

[JerryWu1234]

@wmertens I remembered there was PR about our migration from eslint to Biome.

and someone is focusing on.

[JerryWu1234]

#6115

[JerryWu1234]

#6837

[JerryWu1234]

@mrcaidev @devcaeg Could you help to try it when you are available?

[JerryWu1234]

npm i https://pkg.pr.new/@builder.io/qwik@7072 npm i https://pkg.pr.new/@builder.io/qwik-city@7072 npm i https://pkg.pr.new/eslint-plugin-qwik@7072 npm i https://pkg.pr.new/create-qwik@7072

https://github.com/QwikDev/qwik/pull/7072#issuecomment-2484813553