NuxtN
Nuxt•2y ago
KM

@nuxt/eslint & ESLint Flat File Config

Hey,
I'm really struggling to work out the new flat file format for ES Lint. Ideally I want to use Prettier for formatting, Vue-eslint-parser for handling Vue. Also Tailwind CSS linting with the es lint plugin and type checking for typescript.


Here's my 
eslint.config.mjs
 file, anything commented out just started breaking - 

// @ts-check
import withNuxt from './.nuxt/eslint.config.mjs'
// import vueESLintParser from 'vue-eslint-parser'
// @ts-ignore
import eslintConfigPrettier from 'eslint-config-prettier'
import prettierPlugin from 'eslint-plugin-prettier'
import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'
import eslintPluginTailwindCSS from 'eslint-plugin-tailwindcss'

export default withNuxt(
  {
    // languageOptions.parser: {
    // parser: vueESLintParser,
    // }
    // extends: [
    //   'eslint:recommended',
    //   '@nuxt/eslint-config',
    //   'plugin:prettier/recommended',
    // ],

    plugins: {
      prettier: prettierPlugin,
      tailwindCSS: eslintPluginTailwindCSS,
    },
    rules: {
      ...prettierPlugin.configs.recommended.rules,
      ...eslintConfigPrettier.rules,
      ...eslintPluginPrettierRecommended.rules,
      // ...eslintPluginTailwindCSS.rules,
      // semi: false,
      // quotes: [2, 'single', { avoidEscape: true }],
    },
  },

  {
    ignores: [
      'v1/*',
      'v1/*/**',
      '.nuxt/*',
      '.nuxt/*/**',
      '.vscode/*',
      '.vscode/*/**',
      '.output/*',
      '.ouput/*/**',
      'node_modules',
    ],
  }
)


How do I actually configure this, I'm very confused so to what the proper format is now.
Was this page helpful?