eslint实现硬性拦截需聚焦高危场景:设error级别规则卡住this丢失、undefined访问、隐式转换等问题,并通过ci/cd或husky强制执行阻断。

要让 ESLint 真正“硬性拦截”因隐式丢失(比如 this、undefined 访问、隐式类型转换、未声明变量等)导致的运行时报错,关键不是堆砌规则,而是聚焦几类高危场景,用 error 级别 + 静态可分析规则 在代码提交前就卡住问题。
锁定 this 上下文丢失风险
常见于箭头函数误用、事件回调、定时器中直接调用方法,导致 this 指向意外为 undefined。
- 启用
@typescript-eslint/no-invalid-this(TS 项目)或no-invalid-this(JS),设为2 - 配合
no-unused-vars和no-undef,防止因变量未声明而误当this属性访问 - TS 项目务必在
tsconfig.json中开启"strict": true和"noImplicitThis": true,二者协同才生效
堵死 undefined 访问和空值解构
ESLint 本身不检查运行时是否为 undefined,但可通过规则提前暴露隐患路径:
- 启用
no-prototype-builtins(防obj.hasOwnProperty报错) - 启用
no-unsafe-member-access(TS 插件,对可能为undefined的对象属性访问报错) - 启用
no-unsafe-call(TS 插件,对可能为undefined的函数调用报错) - 搭配
no-unexpected-multiline防止自动分号插入导致的return { }返回undefined
禁用所有隐式转换与宽松比较
这类操作极易在运行时产出 NaN、false、0 等非预期值,引发逻辑断裂:
-
eqeqeq: 2—— 强制使用===/!== -
no-implicit-coercion: 2—— 禁止!!x、+x、x + ''等隐式转类型写法 -
no-mixed-operators: 2—— 防止&&和||与算术运算符混用导致优先级误解 -
no-constant-condition: 2—— 拦截if (true)、while (1)等掩盖真实判断逻辑的写法
构建层强制拦截,不通过就不进主干
规则设为 2 只是第一步;必须让 CI/CD 或本地 pre-commit 流程真正执行并阻断:
- 在
package.json中定义:"lint": "eslint --ext .js,.vue,.ts src/ --no-error-on-unmatched-pattern" - 添加
--max-warnings 0参数,确保任何 warning 也不放过(若你已全设 error,则该参数可省) - Git hook 使用
husky + lint-staged,只检查暂存文件,速度快且不漏 - CI 脚本中明确写
npm run lint || exit 1,退出码非 0 即失败










