Next.js项目中.eslintrc.js的配置

print 'hello world!'module.exports = {
  // 扩展配置，包含Next.js的核心Web Vitals插件和TypeScript支持插件等
  extends: ['next/core-web-vitals', 'plugin:@typescript-eslint/recommended', 'plugin:import/recommended', 'prettier'],
  rules: {
    // 关闭jsx-a11y插件的alt-text规则，通常用于图像的alt属性检查
    'jsx-a11y/alt-text': 'off',
    // 关闭React插件的display-name规则，检查组件是否有displayName
    'react/display-name': 'off',
    // 关闭React插件的no-children-prop规则，防止使用children属性
    'react/no-children-prop': 'off',
    // 关闭Next.js插件的no-img-element规则，不允许使用img元素
    '@next/next/no-img-element': 'off',
    // 关闭Next.js插件的no-page-custom-font规则，不允许使用自定义字体
    '@next/next/no-page-custom-font': 'off',
    // 强制使用一致的类型导入形式
    '@typescript-eslint/consistent-type-imports': 'error',
    // 关闭TypeScript插件的ban-ts-comment规则，不允许使用ts注释
    '@typescript-eslint/ban-ts-comment': 'off',
    // 关闭TypeScript插件的no-explicit-any规则，不允许使用any类型
    '@typescript-eslint/no-explicit-any': 'off',
    // 强制禁止未使用的变量
    '@typescript-eslint/no-unused-vars': 'error',
    // 关闭TypeScript插件的no-non-null-assertion规则，不允许使用非空断言
    '@typescript-eslint/no-non-null-assertion': 'off',
    // 在注释前后强制使用空行
    'lines-around-comment': [
      'error',
      {
        beforeBlockComment: true, // 在块注释前使用空行
        beforeLineComment: true, // 在行注释前使用空行
        allowBlockStart: true, // 允许在块开始时使用空行
        allowObjectStart: true, // 允许在对象开始时使用空行
        allowArrayStart: true // 允许在数组开始时使用空行
      }
    ],
    // 在特定的语句之间强制使用空行
    'padding-line-between-statements': [
      'error',
      {
        blankLine: 'any', // 在任意export语句之间可以有或没有空行
        prev: 'export',
        next: 'export'
      },
      {
        blankLine: 'always', // 在变量声明和任意语句之间强制使用空行
        prev: ['const', 'let', 'var'],
        next: '*'
      },
      {
        blankLine: 'any', // 在连续的变量声明之间可以有或没有空行
        prev: ['const', 'let', 'var'],
        next: ['const', 'let', 'var']
      },
      {
        blankLine: 'always', // 在任意语句和函数或多行const、多行块之间强制使用空行
        prev: '*',
        next: ['function', 'multiline-const', 'multiline-block-like']
      },
      {
        blankLine: 'always', // 在函数或多行const、多行块和任意语句之间强制使用空行
        prev: ['function', 'multiline-const', 'multiline-block-like'],
        next: '*'
      }
    ],
    // 在return语句之前强制使用空行
    'newline-before-return': 'error',
    // 在导入语句之后强制使用空行
    'import/newline-after-import': [
      'error',
      {
        count: 1
      }
    ],
    // 强制导入的顺序
    'import/order': [
      'error',
      {
        groups: ['builtin', 'external', ['internal', 'parent', 'sibling', 'index'], ['object', 'unknown']],
        pathGroups: [
          {
            pattern: 'react', // 在react导入之前使用空行
            group: 'external',
            position: 'before'
          },
          {
            pattern: 'next/**', // 在next导入之前使用空行
            group: 'external',
            position: 'before'
          },
          {
            pattern: '~/**', // 在自定义路径导入之前使用空行
            group: 'external',
            position: 'before'
          },
          {
            pattern: '@/**', // 在内部导入之前使用空行
            group: 'internal'
          }
        ],
        pathGroupsExcludedImportTypes: ['react', 'type'],
        'newlines-between': 'always-and-inside-groups' // 在分组内和分组之间强制使用空行
      }
    ],
    // 禁用不推荐的类型，并推荐使用更具体的类型
    '@typescript-eslint/ban-types': [
      'error',
      {
        extendDefaults: true,
        types: {
          Function: 'Use a specific function type instead', // 使用具体的函数类型替代
          Object: 'Use object instead', // 使用object代替
          Boolean: 'Use boolean instead', // 使用boolean代替
          Number: 'Use number instead', // 使用number代替
          String: 'Use string instead', // 使用string代替
          Symbol: 'Use symbol instead', // 使用symbol代替
          any: false, // 禁用any类型
          '{}': false // 禁用空对象类型
        }
      }
    ]
  },
  settings: {
    react: {
      version: 'detect' // 自动检测React的版本
    },
    'import/parsers': {
      '@typescript-eslint/parser': ['.ts', '.tsx'] // 使用TypeScript解析器解析.ts和.tsx文件
    },
    'import/resolver': {
      node: {},
      typescript: {
        project: './tsconfig.json' // 使用项目中的tsconfig.json文件进行解析
      }
    }
  },
  overrides: [
    {
      files: ['*.ts', '*.tsx', 'src/iconify-bundle/*'], // 指定文件匹配模式
      rules: {
        '@typescript-eslint/explicit-module-boundary-types': 'off', // 关闭显式模块边界类型检查
        '@typescript-eslint/no-var-requires': 'off' // 关闭不允许使用require语句的规则
      }
    }
  ]
};