能否使用Husky + lint-staged在提交前检测Console.log并阻止提交？

完全可以实现，目前主流有两种适配不同场景的方案：

前置依赖安装（未装依赖时可参考） #

如果项目还未安装配置husky和lint-staged，执行以下命令完成基础配置：

# 安装依赖
npm install husky lint-staged -D
# 初始化husky
npx husky install
# 新增pre-commit钩子，执行时调用lint-staged
npx husky add .husky/pre-commit "npx lint-staged"
# 配置prepare脚本，团队成员拉代码install后自动启用husky钩子
npm set-script prepare "husky install"

方案一：配合ESLint实现（推荐，项目已接入ESLint时使用） #

直接用ESLint内置的no-console规则即可实现检测，无需额外开发脚本：

• 打开项目ESLint配置文件（.eslintrc.js、.eslintrc.json等），在rules字段中添加如下配置：

  rules: {
    // error级别：遇到console语句直接抛出错误，中断校验流程
    "no-console": "error"
    // 若允许保留console.warn、console.error，仅拦截console.log可改为下面的配置
    // "no-console": ["error", { allow: ["warn", "error"] }]
  }
  

• 在package.json中添加lint-staged配置：

  {
    "lint-staged": {
      "*.{js,jsx,ts,tsx}": ["eslint --fix"]
    }
  }
  

配置完成后，pre-commit阶段ESLint检测到代码中存在不符合规则的console语句时，会抛出错误并中断提交流程。

方案二：自定义校验脚本（未接入ESLint时使用） #

如果项目没有接入ESLint，无需为了该需求单独接入ESLint，编写简单的自定义脚本即可实现检测：

• 在项目根目录新建scripts/check-console.js文件，写入以下内容：

  const fs = require('fs')
  // 取lint-staged传入的暂存区待检测文件列表
  const checkFiles = process.argv.slice(2)
  let hasIllegalConsole = false
  
  checkFiles.forEach(filePath => {
    const fileContent = fs.readFileSync(filePath, 'utf8')
    // 可按需修改正则匹配规则，当前为匹配所有console调用
    if (/console\.(log|info|warn|error)/.test(fileContent)) {
      console.error(`❌ 文件 ${filePath} 中存在console语句，请删除后再提交`)
      hasIllegalConsole = true
    }
  })
  
  // 存在非法console时返回非零状态码，中断提交
  if (hasIllegalConsole) process.exit(1)
  

• 在package.json中修改lint-staged配置，调用自定义脚本：

  {
    "lint-staged": {
      "*.{js,jsx,ts,tsx}": ["node scripts/check-console.js"]
    }
  }
  

特殊场景适配 #

如果部分console语句是业务需要保留的，可以添加规则跳过检测：

• 用ESLint方案时，在对应console语句上方添加注释// eslint-disable-next-line no-console即可跳过当前行检测
• 用自定义脚本方案时，可以修改正则逻辑，匹配到对应跳过注释时不抛出错误

内容的提问来源于stack exchange，提问作者Noob