跳到主要内容

ESLint

ESLint 的核心作用是“发现潜在问题并统一代码约束”，它更像代码质量检查器，而不是纯格式化工具。

它适合处理什么​

  • 未使用变量
  • 风险写法
  • React Hooks 依赖问题
  • TypeScript 项目中的部分静态规则
  • 团队约定的编码规范

基础配置示例​

module.exports = {
  env: {
    browser: true,
    es2021: true,
    node: true,
  },
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:react/recommended',
  ],
  parser: '@typescript-eslint/parser',
  plugins: ['react', '@typescript-eslint'],
  rules: {
    // 自定义规则
  },
};

和 Prettier 的分工​

  • ESLint：查问题、管规则
  • Prettier：管格式

如果团队同时使用两者，通常要加 eslint-config-prettier 来避免规则冲突。

使用建议​

  • 规则先少后多，先保证能落地
  • 把真正影响稳定性的规则放到高优先级
  • 不要把所有风格问题都交给 ESLint，格式交给 Prettier 或 Biome 更合适