因为VSCode插件能提供编辑时即时反馈，通过监听文件保存等事件触发轻量诊断，在编辑器内实时标红提示；但受限于单文件上下文和内存，无法替代CI中全量、跨文件、强类型分析的ESLint或SonarQube扫描。
为什么用 VSCode 插件做静态扫描，而不是直接跑 ESLint 或 SonarQube？
因为用户需要的是「编辑时即时反馈」，不是等 CI 跑完才看到问题。VSCode 插件能监听文件保存、光标移动、甚至 AST 变化，把 eslint.verify() 或自定义规则封装成轻量级诊断（Diagnostic），直接在编辑器里标红、悬停提示。但别指望它替代完整 CI 扫描——插件受限于 Node.js 进程内存和单文件上下文，跨文件引用、类型推导、宏展开都容易漏判。
- 适合场景：单文件 JSX/TSX 组件 props 类型校验、禁止
console.log提交、检测未使用的useEffect依赖项 - 不适合场景：全项目循环依赖分析、基于 JSDoc 的接口契约验证、需要完整 TS 服务的类型流追踪
- 关键取舍：用
vscode.workspace.onDidSaveTextDocument触发扫描比实时监听更稳；避免在onDidChangeTextDocument里调用耗时规则，否则会卡住编辑
如何让自定义规则识别 React/TSX 而不只是 JS？
ESLint 默认不解析 JSX 和 TypeScript 语法，插件必须显式配置 parser 和 parserOptions。VSCode 插件启动时若复用工作区已有的 .eslintrc.cjs，要确保其中 parser 指向 @typescript-eslint/parser，且 parserOptions.project 指向有效的 tsconfig.json 路径——否则 eslint.linter.verify() 会抛 Cannot read property 'map' of undefined 错误。
- 实操要点：在插件激活逻辑中，用
vscode.workspace.getConfiguration('eslint').get('options')读取用户配置，而非硬编码 parser 路径 - TSX 特有坑：
parserOptions.ecmaFeatures.jsx必须设为true，否则<div></div>会被当成非法 token - 性能注意：每次验证都重新加载
tsconfig.json很慢，建议缓存解析结果，或改用typescript.parseJsonConfigFileContent预热
怎么把扫描结果准确显示在编辑器里，又不干扰用户操作？
VSCode 的 DiagnosticCollection 是唯一合法出口，但它的生命周期和范围必须严格匹配：collection name 要全局唯一，uri 必须是 vscode.Uri.file() 格式，range 坐标必须基于 document.getText() 的 UTF-16 编码偏移（不是字节或 Unicode 码点）——否则定位错位、悬停空白、甚至崩溃。
- 常见错误：
new vscode.Position(line, char)中char传了字符串长度（如'const a = 1'.length），实际该用document.positionAt(offset)换算 - 避免覆盖：同一 uri 的 collection 不能重复
set()，需先get(uri)清空旧诊断，否则旧 warning 永远残留 - 用户友好细节：用
severity: vscode.DiagnosticSeverity.Information标记低风险建议（如「可改用 optional chaining」），别全用Error导致红波浪线泛滥
插件打包后规则不生效，本地调试却正常？
根本原因是 node_modules 未正确打包进 extension.js。VSCode 插件运行在独立 Node.js 环境，不会自动 resolve 工作区里的 node_modules，所有依赖（包括 eslint、@typescript-eslint/experimental-utils）必须通过 webpack 构建时 external 掉或 inline 进 bundle。
立即学习“前端免费学习笔记（深入）”；
- 推荐方案：用
webpack.config.js配置externals: { vscode: 'commonjs vscode' }，其余全部target: 'node'打包 - 验证方法：解压
.vsix文件，检查extension.js是否包含require('eslint')字样；若看到var eslint_1 = __importDefault(require("eslint"));就对了 - 隐蔽陷阱：TypeScript 类型声明文件（
.d.ts）不会被打包，但eslint的类型定义被import type引用时，tsc 仍会报错——此时需在tsconfig.json中设"types": []显式屏蔽
最易被忽略的是路径权限：插件里用 fs.readFileSync 读取本地规则配置时，路径必须是绝对路径（path.join(context.extensionPath, 'rules', 'no-console.js')），相对路径在打包后必然失败。
