必须启用eslint.validate实现实时校验,否则仅保存时检查;正确配置为"eslint.validate": ["javascript","javascriptreact","typescript","vue"],避免缩写或遗漏语言类型。

ESLint插件必须启用实时校验
不启用 eslint.validate,ESLint就只在保存时检查,错过编码过程中的即时反馈。很多变量拼写错误、未定义引用、undefined 误用等,靠肉眼根本难发现,但ESLint能在你敲完括号的瞬间标红。
正确做法是在 VSCode 设置(settings.json)中明确声明校验语言:
"eslint.validate": ["javascript", "javascriptreact", "typescript"]- 避免只写
"javascript"——React JSX 或 TSX 文件里的jsx语法会被跳过 - 如果项目用 Vite + Vue,还得加
"vue",否则<script setup>里的 JS 不校验
常见坑:装了 ESLint 插件但没配 eslint.validate,或者只配了 ["js"] 这种无效缩写,结果代码写错了也不报错。
Prettier 和 ESLint 冲突时优先关掉 ESLint 的格式类规则
两者都管缩进、引号、分号,硬要同时开就会互相打架:Prettier 格式化完,ESLint 立刻标红说“不该有分号”;ESLint 修复后,Prettier 又把它删掉。这不是配置问题,是职责重叠。
标准解法是让 ESLint 专注逻辑和质量,Prettier 专注格式:
- 安装
eslint-config-prettier,并在.eslintrc.js的extends末尾加上'prettier' - 删掉 ESLint 配置里所有格式相关规则,比如
quotes、semi、comma-dangle - 把格式控制全交给 Prettier 的
.prettierrc,例如:"semi": false、"singleQuote": true
注意:不要试图用 eslint --fix 修格式问题——它修得不彻底,还可能跟 Prettier 输出不一致。
使用 JSON Schema 验证 JSON 数据,从示例 JSON 生成 schema,并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。
JavaScript Booster 的重构操作不是玩具,得看光标位置
这个插件的灯泡(?)只在语义完整的位置才出现,不是每行都能点。比如 var x = 1 能转 const,但 var x 单独一行就不会亮灯泡——因为没初始化,无法安全推断是否可变。
关键判断点:
- 光标必须落在完整语句内(如整个
if块、函数声明、变量赋值行),不能只停在某个单词或括号里 - 箭头函数转换要求原函数没有
this、arguments或super引用,否则插件会禁用该选项 - “Replace with ?:” 对嵌套
if无效,只处理单层二元分支;三层以上建议手动改或用更高级的 codemod
别指望它能重构任意代码——它的安全边界很严,宁可不出现选项,也不做危险转换。
Quokka.js 是调试式编码的刚需,不是可选玩具
写 JS 逻辑时,与其反复 console.log + 刷新页面,不如把光标停在表达式上,Quokka 会立刻显示执行结果(包括变量值、函数返回值、甚至 Promise 状态)。它不是 REPL,而是嵌入在编辑器里的实时求值引擎。
典型用法:
- 在数组方法链中间加个空行,输入
//?,Quokka 自动补全当前链的输出 - 写一个
filter条件,后面接//? items.filter(...),立刻看到筛选结果 - 对异步函数加
await后跟//?,它会真正 await 并展示 resolved 值
容易被忽略的是:Quokka 默认只运行当前文件的顶层代码。如果依赖其他模块,得在文件顶部加 // @ts-nocheck 或显式 import,否则会报 ReferenceError。

















