1. Vscode 打开 react 项目 Eslint 静默失效的真实场景你打开一个 React TypeScript 项目代码里明明有未使用的变量、缺失的依赖数组、any 类型满天飞但 Vscode 里一条波浪线都没有。打开输出面板切到 ESLint 通道看到一行红字Cannot find module typescript-eslint/eslint-plugin。这时候你去搜绝大多数答案让你删node_modules重装、检查 Node 版本、对比同事配置折腾一圈还是不行。这个问题的本质不是 ESLint 本身坏了而是Vscode 的 ESLint 扩展在加载时解析模块的路径和你终端里跑npx eslint的路径不是同一个。终端里能跑通是因为 npm/yarn 把依赖提升到了你当前 shell 的工作目录而 Vscode 扩展进程有它自己的cwd和模块解析起点一旦工作区是多项目嵌套结构或者扩展版本与项目本地 ESLint 版本错位它就会去错误的位置找typescript-eslint/eslint-plugin找不到就静默降级——不报错弹窗只在输出通道里留一行。我试过在一个 monorepo 风格的目录下打开 Vscode父级文件夹里放了project-a、project-b每个子项目都有自己的package.json和.eslintrc。结果就是 ESLint 扩展在父级根目录找node_modules而依赖装在子项目里于是每个子项目都报Cannot find module。把工作区改成只打开单个项目文件夹问题立刻消失。这不是玄学是模块解析路径的问题。还有一种情况项目用的是eslint-config-alloy/typescript这类共享配置它内部require了typescript-eslint/eslint-plugin。如果你的package.json里只装了eslint和typescript-eslint/parser没显式装typescript-eslint/eslint-pluginnpm 的扁平化提升可能在某些 lockfile 状态下没把它放到顶层终端跑eslint时 Node 能从嵌套路径找到但 Vscode 扩展的解析器找不到。这就是为什么“别人 install 完就行你不行”——lockfile 和安装顺序不同提升结果不同。适合谁看正在用 Vscode 写 React TypeScript、ESLint 扩展装了但不出波浪线、输出通道报Cannot find module typescript-eslint/eslint-plugin或eslint-config-alloy/typescript找不到模块的开发者。下面从工作区依赖、插件加载顺序、settings 配置三处切入给出可复制的配置和逐步验证动作。2. TaoToken 前置统一模型接入与 ESLint 排障的关系你可能会问ESLint 报错和 TaoToken 有什么关系关系在于当你的 ESLint 修好之后下一步往往是要接一个模型来做代码审查、自动修复建议或者跑 Agent 做重构。这时候如果模型接入的 Base URL、Key、Model ID 三件套没配好你会从“ESLint 不生效”直接掉进“模型请求 401”的坑里。与其分两次折腾不如先把接入层统一掉。TaoToken 是一个模型接入网关官网地址是 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 入口是 https://taotoken.net/api 。它的作用是让你用一套 Base URL 和 Key去调用不同厂商的模型不用在每个工具里分别填不同的地址。对于前端项目来说你可以在 Vscode 里装 Cline、Continue 或者 Claude Code 这类插件把 Base URL 指向 TaoTokenModel ID 填你需要的模型Key 用 TaoToken 控制台生成的。具体操作路径先到模型对话页面 https://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_contentmodel_chatutm_campaignrewrite 确认你要用的模型名称然后去控制台 https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewrite 生成 API Key再到 API Keys 页面 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi_keysutm_campaignrewrite 复制 Key。如果你用的是 Claude Code接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里面有 Base URL 和认证头的写法。为什么要在 ESLint 文章里提这个因为很多 React 项目的 ESLint 规则里会集成eslint-plugin-import做模块解析检查而当你用模型生成代码时模型可能会引入不存在的模块路径ESLint 会报import/no-unresolved。如果你同时把模型接入配好就能在写代码阶段让模型遵循项目已有的 ESLint 规则减少事后修 lint 的成本。TaoToken 在这里的角色是提供稳定的模型调用入口不是替代 ESLint也不是替代编辑器。需要区分的是ESLint 是本地静态检查工具TaoToken 是远程模型调用网关两者不在同一层。但你的开发工作流里它们会同时出现在 Vscode 中。先把 ESLint 的模块解析问题解决再配模型接入顺序不要反。如果你需要长期跑编码 Agent可以看 Coding Plan 页面 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 里面有套餐和调用方式的说明。3. 可复制配置settings.json 片段与依赖安装命令这一节直接给可复制的配置。先解决依赖问题再解决 Vscode 设置问题。第一步在项目根目录执行卸载和重装。注意包名里的typescript-eslint不要写错很多人手打时漏掉或者把typescript-eslint写成typescript-eslint少一个-。命令如下npm uninstall --save-dev eslint typescript typescript-eslint/parser typescript-eslint/eslint-plugin eslint-plugin-react eslint-config-alloy npm install --save-dev eslint typescript typescript-eslint/parser typescript-eslint/eslint-plugin eslint-plugin-react eslint-config-alloy如果你用 yarnyarn remove eslint typescript typescript-eslint/parser typescript-eslint/eslint-plugin eslint-plugin-react eslint-config-alloy yarn add --dev eslint typescript typescript-eslint/parser typescript-eslint/eslint-plugin eslint-plugin-react eslint-config-alloy装完后确认node_modules/typescript-eslint/eslint-plugin目录存在。如果不存在说明安装没成功检查 npm registry 配置和网络。可以用npm ls typescript-eslint/eslint-plugin看它被提升到了哪一层。第二步在项目根目录创建或修改.vscode/settings.json。这个文件是工作区级别的优先级高于用户级别。关键配置是eslint.workingDirectories和eslint.nodePath。如果你只打开单个项目workingDirectories可以设为[{ mode: auto }]如果是多根工作区要显式列出每个子项目路径。{ eslint.enable: true, eslint.debug: true, eslint.run: onType, eslint.workingDirectories: [ { mode: auto } ], eslint.nodePath: ./node_modules, eslint.options: { extensions: [.js, .jsx, .ts, .tsx] }, eslint.validate: [ javascript, javascriptreact, typescript, typescriptreact ], eslint.probe: [ javascript, javascriptreact, typescript, typescriptreact ] }如果你是多项目嵌套比如父目录下有packages/app和packages/lib改成{ eslint.workingDirectories: [ { directory: ./packages/app, changeProcessCWD: true }, { directory: ./packages/lib, changeProcessCWD: true } ] }changeProcessCWD设为true会让 ESLint 扩展在检查该目录文件时把进程工作目录切到对应子项目这样模块解析就会从子项目的node_modules开始找。第三步如果你用的是 Cline 或 Claude Code 这类插件并且要接 TaoToken配置片段如下。以 Cline 的 MCP 配置为例Base URL 填https://taotoken.net/apiKey 填你在控制台生成的Model ID 填模型对话页面里看到的名称。三件套缺一不可{ mcpServers: { taotoken: { url: https://taotoken.net/api, headers: { Authorization: Bearer YOUR_TAOTOKEN_KEY }, model: YOUR_MODEL_ID } } }如果你用 Codex 的auth.json格式类似{ baseURL: https://taotoken.net/api, apiKey: YOUR_TAOTOKEN_KEY, model: YOUR_MODEL_ID }注意ESLint 的settings.json和模型接入的配置是两套东西不要混在同一个文件里。ESLint 配置放.vscode/settings.json模型接入配置放对应插件自己的配置文件。4. 验证请求与成功结果重载窗口后看输出通道配置改完后必须重载 Vscode 窗口否则扩展不会重新读取settings.json。快捷键CtrlShiftPMac 是CmdShiftP输入Developer: Reload Window回车。重载后打开一个.tsx文件故意写一行有问题的代码比如const App () { const unused 123; return divhello/div; };如果 ESLint 生效unused下面会出现黄色波浪线提示unused is assigned a value but never used。同时打开输出面板CtrlShiftU在右上角下拉里选ESLint。正常输出应该类似[Info] ESLint server is running. [Info] ESLint library loaded from: /your-project/node_modules/eslint/lib/api.js [Info] ESLint options: {...}如果还报Cannot find module typescript-eslint/eslint-plugin输出通道里会显示它尝试加载的路径。对比这个路径和你node_modules里的实际路径就能定位是workingDirectories没配对还是依赖没装到那一层。再验证模型接入是否通。如果你配了 Cline在 Cline 面板里发一条消息看是否返回正常。如果返回 401检查 Key 是否复制完整如果返回local proxy failed检查 Base URL 是否写成了https://taotoken.net/api而不是带其他路径。如果返回reading choices相关错误说明响应格式和插件预期不一致检查 Model ID 是否填错。成功的结果是ESLint 波浪线正常出现保存时按规则自动修复如果你开了eslint.run: onType和editor.codeActionsOnSave模型对话也能正常返回。两者互不干扰。5. 本篇常见错排查401、local proxy failed、reading choices、OAuth这一节对照真实报错逐个排查。报错一Cannot find module typescript-eslint/eslint-plugin反复出现。先确认node_modules/typescript-eslint/eslint-plugin/package.json存在。如果存在但 ESLint 还报找不到在.vscode/settings.json里加eslint.nodePath: ./node_modules并确认eslint.workingDirectories指向的是包含node_modules的那一层。如果是多项目用changeProcessCWD: true。还有一个隐藏原因Vscode ESLint 扩展版本太老不支持workingDirectories的changeProcessCWD字段。在扩展面板里把 ESLint 更新到最新版。报错二eslint-config-alloy/typescript找不到模块。这个配置内部依赖typescript-eslint/eslint-plugin。如果你的package.json里没显式声明这个包只靠传递依赖在某些 npm 版本下不会被提升到顶层。解决方法是显式安装npm install --save-dev typescript-eslint/eslint-plugin。装完后在.eslintrc.js里确认extends路径写的是alloy/typescript而不是eslint-config-alloy/typescript取决于你的配置写法。报错三模型请求返回 401。说明 Key 无效或没带上。检查Authorization头格式TaoToken 用的是Bearer YOUR_KEY。如果你把 Key 写在了 URL 参数里改成请求头。Key 在控制台生成后只显示一次如果没保存重新生成一个。报错四local proxy failed。这个报错通常出现在插件尝试通过本地代理转发请求时。检查 Base URL 是否写成了https://taotoken.net/api不要多加/v1或/chat/completions具体路径由插件自己拼接。如果你在环境变量里设了HTTP_PROXY先临时取消排除本地网络层干扰。报错五reading choices相关错误。说明插件收到了响应但解析choices字段失败。常见原因是 Model ID 填了一个不存在的模型或者该模型不支持当前调用方式。去模型对话页面确认模型名称复制准确的 ID。如果你用的是 Claude Code 接入参考文档里的模型映射表。报错六OAuth 相关错误。如果你用的是需要 OAuth 的插件比如某些 GitHub Copilot 替代方案但配置里填了 API Key 方式会报 OAuth 失败。确认你的插件支持 API Key 认证。TaoToken 的接入方式是 API Key不是 OAuth。如果插件只支持 OAuth换一个支持自定义 Base URL 和 Key 的插件比如 Cline。排查顺序建议先解决 ESLint 本地模块解析再解决模型接入。不要同时改两边配置否则分不清是哪个引起的。6. 语义一致 CTA把 ESLint 和模型接入都落到可复制的路径上ESLint 修好后你的 React 项目至少能正常提示和自动修复了。接下来如果要把模型接入开发流按你的场景选入口排障和接入类问题直接去 API Keys 页面复制 Keyhttps://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi_keysutm_campaignrewrite 接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里面有 Base URL、认证头和常见插件的配置示例。验证模型是否可用去模型对话页面发一条测试消息https://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_contentmodel_chatutm_campaignrewrite 确认返回正常再往插件里配。长期编码和 Agent 场景看 Coding Planhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 里面有调用额度和套餐说明。Claude Code 用户直接看 Anthropic 接入文档https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentclaude_codeutm_campaignrewrite 按里面的 Base URL 和 Key 填法操作。最后提醒一个实操细节.vscode/settings.json建议提交到 git这样团队里其他人拉下来就能用同一套 ESLint 工作目录配置避免“别人行你不行”的情况再次发生。如果项目是 monorepo在根目录的.vscode/settings.json里把每个子包的workingDirectories都列上比让扩展自动猜要稳。