console.debug触发ESLint no-restricted-syntax错误的排查与调整

为什么直接设置"no-restricted-syntax": "warn"无效 #

no-restricted-syntax规则支持两种配置方式：简单字符串（仅指定级别）或数组（包含具体AST选择器、提示消息和级别）。你使用的NX框架通过@nrwl/nx插件注入了数组形式的规则配置，这种配置优先级高于简单字符串设置，所以直接改级别不会生效。

理解限制console.debug的AST选择器 #

触发错误的AST选择器是：MemberExpression[object.name="console"][property.name="debug"]。这个选择器会匹配所有调用console.debug()的代码节点。

具体解决步骤 #

1. 查看当前生效的规则配置
   在终端运行项目的lint命令并打印配置，找到no-restricted-syntax的完整设置：

   nx lint --print-config 你的项目名称
   

   输出里会看到该规则的数组配置，包含所有被限制的AST选择器、提示信息和级别。

2. 修改eslintrc.json中的规则
   在项目的eslintrc.json的rules字段中，用数组形式重新定义no-restricted-syntax，将console.debug对应的配置项的severity改为warn，其他限制保持原有级别：

   {
     "rules": {
       "no-restricted-syntax": [
         // 全局默认级别，单个配置项可覆盖
         "warn",
         // 复制print-config输出中其他需要保留的限制项（比如NX默认的其他console方法限制）
         {
           "selector": "MemberExpression[object.name=\"console\"][property.name=\"log\"]",
           "message": "Unexpected property on console object was called",
           "severity": "error"
         },
         // 单独调整console.debug为警告
         {
           "selector": "MemberExpression[object.name=\"console\"][property.name=\"debug\"]",
           "message": "Unexpected property on console object was called",
           "severity": "warn"
         }
       ]
     }
   }
   

3. 生效配置
   保存配置后，重启VS Code的ESLint服务（可以通过命令面板执行ESLint: Restart ESLint Server），或者重新运行nx lint验证效果。

可选方案：仅允许console.debug #

如果你想保留其他console方法的限制，只放开console.debug，可以在规则数组中移除对应的MemberExpression[object.name="console"][property.name="debug"]选择器即可。

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