@cgzair/eslint-config-cgz

简介

本包提供了《信息技术部前端编码手册》配套的 ESLint 可共享配置（拥抱 ESLint v9 Flat Config 扁平化配置），支持 JavaScript、TypeScript、React、Vue、Uni-App、Node.js、ES5 等多种项目类型。

本包的依赖（如各个插件和解析器）已经内置在 dependencies 中，你无需在项目中手动安装插件或解析器，直接安装本包与 eslint 即可。

安装

pnpm add @cgzair/eslint-config-cgz eslint -D

使用

在项目根目录下创建扁平化配置文件 eslint.config.mjs：

import cgz, { defineConfig } from "@cgzair/eslint-config-cgz";

export default defineConfig([
  {
    ignores: ["**/lib/**", "**/node_modules/**", "dist/**"],
  },
  // 1. 引入规则配置（按项目类型选择，详情见下文）
  ...cgz.common,

  // 2. Prettier 冲突解决配置（建议置于数组最末尾）
  cgz.prettier,

  {
    // 3. 自定义规则配置
    rules: {
      "no-console": "warn",
    },
  },
]);

配置项清单

@cgzair/eslint-config-cgz 导出的配置对象 cgz 提供了以下配置项，它们全部为 FlatConfig[] 数组或 FlatConfig 对象：

1. JavaScript 项目

| 配置项 | 描述 | | ------------- | ------------------------------------------------------- | | cgz.common | 针对一般 JavaScript 项目的基础规范规则 | | cgz.react | 针对 JavaScript React 项目的规则规范（包含 Hooks 规则） | | cgz.vue | 针对 JavaScript Vue 项目的规则规范 | | cgz.uniApp | 针对 JavaScript Uni-App 项目的规则规范 | | cgz.node | 针对 JavaScript Node.js 项目的规则规范 | | cgz.es5 | 针对传统 ES5 及以下环境老项目的配置 | | cgz.jsxA11y | 独立的 JSX 无障碍（Accessibility）辅助规则（可选） |

2. TypeScript 项目

| 配置项 | 描述 | | ---------------- | ------------------------------------------------------- | | cgz.typescript | 针对一般 TypeScript 项目的基础规范规则 | | cgz.ts.react | 针对 TypeScript React 项目的规则规范（包含 Hooks 规则） | | cgz.ts.vue | 针对 TypeScript Vue 项目的规则规范 | | cgz.ts.uniApp | 针对 TypeScript Uni-App 项目的规则规范 | | cgz.ts.node | 针对 TypeScript Node.js 项目的规则规范 |

提示：在使用 TypeScript 相关配置时，请确保项目根目录下已安装 typescript 依赖并配置了 tsconfig.json。

3. Prettier 冲突解决

• cgz.prettier：用于关闭所有与 Prettier 格式化冲突的 ESLint 规则。请务必将其置于配置数组的最后一位。

配合特定配置使用示例

TS React + Prettier 项目配置示例

import cgz, { defineConfig } from "@cgzair/eslint-config-cgz";

export default defineConfig([...cgz.ts.react, cgz.prettier]);

TS Vue + JSX a11y 项目配置示例

import cgz, { defineConfig } from "@cgzair/eslint-config-cgz";

export default defineConfig([...cgz.ts.vue, ...cgz.jsxA11y, cgz.prettier]);

IDE 插件配套集成

推荐使用 vscode 作为开发工具，然后安装 ESLint 插件，安装地址：https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint。

在 .vscode/settings.json 中确保开启了保存自动修复功能：

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  }
}