@easyv/eslint-config

一个开箱即用的 ESLint 配置，支持 TypeScript、React 等现代开发场景。

特性

• ✨ 基于 ESLint 9.0 扁平配置（Flat Config）
• 🔷 完整的 TypeScript 支持
• ⚛️ React Hooks 和 React Refresh 规则
• 🎯 严格的代码质量检查
• 🔧 支持自定义扩展配置

版本要求

• ESLint: >= 9.0.0

安装

# 使用 pnpm
pnpm add -D @easyv/eslint-config eslint

# 使用 npm
npm install -D @easyv/eslint-config eslint

# 使用 yarn
yarn add -D @easyv/eslint-config eslint

注意：本配置使用 ESLint 9.0 的扁平配置格式。如果你的项目使用的是 ESLint 8.x，请先升级到 9.x 版本。

使用方法

基础用法

在项目根目录创建 eslint.config.js 文件：

import easyvConfig from '@easyv/eslint-config';

export default easyvConfig();

自定义配置

你可以传入配置对象来扩展或覆盖默认配置：

import easyvConfig from '@easyv/eslint-config';

export default easyvConfig({
  // 添加全局变量
  globals: {
    myGlobal: true,
    wx: true,
  },
  
  // 覆盖或添加规则
  rules: {
    '@typescript-eslint/no-explicit-any': 'off',
    'no-console': 'warn',
  },
  
  // 添加忽略文件
  ignores: [
    '**/temp/**',
    '**/*.config.js',
  ],
});

与其他配置组合

import easyvConfig from '@easyv/eslint-config';
import someOtherConfig from 'some-other-config';

export default [
  ...easyvConfig(),
  ...someOtherConfig,
  {
    // 你自己的额外配置
    rules: {
      'no-console': 'warn',
    },
  },
];

配置详情

内置规则集

本配置集成了以下规则集：

• @eslint/js - ESLint 推荐的 JavaScript 规则
• typescript-eslint - TypeScript 推荐规则
• eslint-plugin-react-hooks - React Hooks 最佳实践
• eslint-plugin-react-refresh - React Fast Refresh 规则（Vite）

默认忽略目录

以下目录默认会被忽略检查：

• **/dist/
• **/build/
• **/public/

主要规则说明

可能的问题（Possible Problems）

| 规则 | 级别 | 说明 | |------|------|------| | array-callback-return | error | 数组回调函数必须有返回值 | | no-await-in-loop | error | 禁止在循环中使用 await | | no-constructor-return | error | 禁止在构造函数中返回值 | | no-duplicate-imports | error | 禁止重复导入 | | no-promise-executor-return | error | 禁止在 Promise 执行器中返回值 | | no-self-compare | error | 禁止自身比较 | | no-template-curly-in-string | error | 禁止在普通字符串中使用模板字符串语法 | | no-unreachable-loop | error | 禁止不可达的循环 | | no-use-before-define | error | 禁止在定义前使用变量（函数除外） | | no-useless-assignment | error | 禁止无用的赋值 |

TypeScript 规则

| 规则 | 级别 | 说明 | |------|------|------| | @typescript-eslint/no-explicit-any | warn | 警告使用 any 类型 | | @typescript-eslint/no-empty-object-type | error | 禁止空对象类型（允许接口） | | @typescript-eslint/no-unused-vars | error | 禁止未使用的变量（支持下划线前缀忽略） |

未使用变量规则

支持使用下划线前缀来忽略未使用的变量：

// ✅ 正确：使用下划线前缀忽略未使用的参数
function example(_unusedParam: string, usedParam: number) {
  return usedParam * 2;
}

// ✅ 正确：解构时忽略某些属性
const [_first, second] = array;
const { _id, name } = user;

// ❌ 错误：未使用的变量
function bad(param: string) {
  const unused = 123;
  return 'hello';
}

添加检查脚本

在 package.json 中添加以下脚本：

{
  "scripts": {
    "lint": "eslint .",
    "lint:fix": "eslint . --fix"
  }
}

编辑器集成

VS Code

1. 安装 ESLint 扩展

2. 在 .vscode/settings.json 中添加：

{
  "eslint.enable": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact"
  ],
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  }
}

与 TypeScript 一起使用

本配置已经内置 TypeScript 支持，确保项目中有 tsconfig.json 文件即可。