Q20 · 代码质量

项目中 ESLint 这块你是如何配置的？怎么平衡团队抗拒情绪？

ESLint代码规范Prettier

⚡ 速记答案（30 秒）

  • 配置：基于 eslint:recommended + TypeScript/Vue/React 插件 + Prettier
  • 规则分级：致命问题设为 error，风格类设为 warn 或交给 Prettier
  • 提供一键修复脚本：npm run lint -- --fix
  • 在 CI 中逐步收紧：先对新代码强制，老代码慢慢整改
  • 组织分享会说明收益（减少 Bug、统一风格），争取团队认同

📖 详细讲解

ESLint 配置策略


推荐配置组合


module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:vue/vue3-recommended',
    'prettier', // 放最后
  ],
  rules: {
    // 致命问题
    'no-debugger': 'error',
    'no-console': 'warn',
    // 风格交给 Prettier
    'semi': 'off',
    'quotes': 'off',
  },
};

团队推广策略


1. 渐进式引入

• 先 warn 不 error

• 新文件强制，老文件豁免


2. 自动化

• pre-commit hook

• CI 检查

• 一键修复脚本


3. 沟通收益

• 减少 code review 争议

• 避免低级错误

• 统一代码风格

💡
面试技巧：回答工程化问题时，结合你实际项目中的配置和优化经验，更有说服力。