ESLint与Prettier必须协同配置：ESLint专注逻辑校验（如no-unused-vars），Prettier专责格式化（如引号、分号），需禁用ESLint格式规则、引入eslint-config-prettier屏蔽冲突，并设Prettier为VSCode默认格式化器。
ESLint + Prettier 必须配对启用，否则格式和校验会打架
只装 ESLint 会标红但不自动修；只装 Prettier 会乱格式但不管逻辑错误。两者必须协同，否则保存时可能反复格式化又报错，甚至删掉你写的分号或引号。
- 安装
ESLint和Prettier - Code formatter两个插件 - 在项目根目录加
.eslintrc.js，内容至少包含extends: ['eslint:recommended', 'prettier'] - 在
settings.json中设"editor.defaultFormatter": "esbenp.prettier-vscode"和"editor.formatOnSave": true - 关键一步：运行
npx eslint --init时选「Use a popular style guide」再选「Prettier」，它会自动加eslint-config-prettier并禁用冲突规则
漏掉 eslint-config-prettier 是最常见坑——比如 ESLint 规则要求单引号，Prettier 也设了单引号，看似一致，但 ESLint 的 quotes 规则仍会尝试修复，导致保存时抖动。
Volar 要替代 Vetur，Vue3 项目里两者共存必出问题
Volar 是 Vue 官方为 Vue 3（尤其是 <script setup>）打造的现代语言服务，Vetur 已停止维护。同时启用会导致类型提示错乱、ref 推导失败、模板中 props 校验失效。
- 卸载
Vetur（哪怕只是禁用也不够，VSCode 有时会缓存旧服务） - 确认
Volar插件已启用，且状态栏右下角显示「Vue (Volar)」而非「Vue (Vetur)」 - 如用 TypeScript，确保
tsconfig.json中有"compilerOptions": { "types": ["volar"] }（部分版本需手动加） - 遇到跳转不到
defineProps类型定义？检查是否开了"vue.inlayHints.propsEnabled": true（Volar 设置项）
尤其注意：Volar 的「Take Over Mode」默认关闭，但开启后会接管所有 .vue 文件的语言服务——这是正确行为，别因看到 JS/TS 文件高亮变淡就关掉它。
立即学习“前端免费学习笔记（深入）”；
路径补全和跳转要靠 Path Intellisense + 别名路径跳转插件配合
写 import { api } from '@/api/user' 时，光有 Path Intellisense 不够：它能提示路径，但 Ctrl+点击进不去；没配别名跳转，编辑器根本不知道 @ 指向 src/。
- 先在
jsconfig.json或tsconfig.json里声明别名："baseUrl": ".", "paths": { "@/*": ["src/*"] } - 装
Path Intellisense，它会在输入import时自动补全@/api/...下的文件 - 装
@/alias-skip或Vue Alias Skip（Vue 专用），让 Ctrl+点击真正跳转到目标文件 - 如果跳转仍失败，检查
jsconfig.json是否在项目根目录，且 VSCode 已重启（改配置后不重启无效）
别名路径配置本身不难，但 VSCode 缓存顽固——改完 jsconfig.json 后务必用 Developer: Restart Extension Host 命令刷新，否则补全和跳转都卡在旧状态。
别忽略文件图标和 TODO 管理，它们直接影响日常找文件和任务推进效率
看着满屏白色 .js .ts .vue 文件名，找组件像开盲盒；// TODO 散落在各处，过两天就忘了在哪——这不是编码问题，是信息密度太低。
- 装
vscode-icons，设置 → 「Icons Theme」选「VSCode Icons」，立刻区分 Vue 组件、API 文件、样式文件 - 装
Todo Tree，它会扫描整个工作区，把所有// TODO// FIXME提取到侧边栏，支持按文件、关键词过滤 - 想高亮括号匹配？装
Bracket Pair Colorizer，但注意新版 VSCode 已内置类似功能，可先试"editor.guides.bracketPairs": true - 别小看图标：当项目超过 200 个文件，靠颜色比靠后缀快 3 秒以上，每天省下的时间够喝两杯咖啡
图标和 TODO 插件不参与构建、不改代码逻辑，但它们是降低认知负荷的隐形基础设施——没它们，人容易在文件树和注释海洋里迷路，尤其赶需求时最明显。
