Vue 3 项目必须用 Volar，Vue VSCode Tools 是旧版官方插件且已停止维护，对 Composition API 和 <script setup> 支持不完整；Volar 深度集成 TypeScript 服务，可正确推导 defineProps 和 defineEmits 类型，而 Vue VSCode Tools 会导致 ref 类型提示为空、props 属性误标红等类型服务失效问题。
Vue项目该选 Volar 还是 Vue VSCode Tools？
Vue 3 项目必须用 Volar，Vue VSCode Tools 是旧版官方插件，已停止维护，对 Composition API 和 <script setup></script> 支持不完整。Volar 不仅提供语法高亮、模板类型检查，还深度集成 TypeScript 服务，能正确推导 defineProps 和 defineEmits 类型。
常见错误现象：装了 Vue VSCode Tools 后，ref 类型提示为空、props 上属性标红但实际运行正常——这是类型服务未生效的典型表现。
- 新项目直接安装
Volar，禁用Vetur（如有）和Vue VSCode Tools - 需在
settings.json中启用"volar.autoInsertDotValue": true，避免手动补全.value - 若使用 Nuxt 3，额外安装
Nuxt DevTools，它会覆盖部分 Volar 功能，需注意冲突
ESLint 和 Prettier 能不能共存？
能，但默认配置下会打架——ESLint 的格式规则（比如 semi、quotes）和 Prettier 冲突，导致保存时反复格式化又报错。
关键不是“装两个”，而是“让 ESLint 只管逻辑，Prettier 只管样式”。做法是用 eslint-config-prettier 关闭 ESLint 所有格式类规则。
立即学习“前端免费学习笔记（深入）”；
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 安装依赖：
npm install -D eslint-config-prettier - 在
.eslintrc.js的extends末尾加上'prettier'（顺序不能错） - VS Code 设置里关掉
editor.formatOnSave对 ESLint 的启用，只留给 Prettier - 验证方式：删掉一个分号，ESLint 应只报
no-unexpected-multiline类逻辑错误，不再报semi
路径别名跳转失效，到底该配 jsconfig.json 还是 tsconfig.json？
取决于你项目用的是 JS 还是 TS。TypeScript 项目优先读 tsconfig.json，JavaScript 项目（哪怕用了 @types）默认只认 jsconfig.json。VS Code 的路径跳转能力依赖这个配置文件里的 compilerOptions.paths。
容易踩的坑：只改了 tsconfig.json 却在 JS 文件里 Ctrl+Click 跳不到——因为 JS 语言服务没加载那个配置。
- JS 项目：必须建
jsconfig.json，内容至少包含{"compilerOptions":{"baseUrl":".","paths":{"@/*":["src/*"]}}} - TS 项目：
tsconfig.json里已有paths，但需确认"include"包含了.vscode/或当前工作区根目录 - 插件
Path Intellisense只补全路径，不解决跳转；真正修复跳转靠配置本身 + 重启 TS 服务（Ctrl+Shift+P → “Developer: Restart TS Server”）
Live Server 和 Debugger for Chrome 有什么本质区别？
Live Server 是轻量静态服务，只起一个本地 HTTP 服务器并监听文件变化后自动刷新页面；Debugger for Chrome 是调试器，把 VS Code 和 Chrome DevTools 连起来，支持断点、变量监视、调用栈追踪。
它们解决的问题完全不同：一个管“跑起来”，一个管“为什么出错”。但很多人误以为装了 Live Server 就不用配调试器了，结果遇到异步逻辑或状态问题只能 console.log。
-
Live Server适合纯 HTML/CSS/JS 原生开发，开箱即用；Vue/React 项目建议用框架自带 dev server（如vite dev），它更准 -
Debugger for Chrome必须配launch.json，关键字段是url（指向 dev server 地址）和sourceMapPathOverrides（映射构建后的路径回源码） - 两者可共存：Live Server 启服务，Chrome 调试器连上去，但不要同时用 Live Server 的自动刷新和 Chrome 的 live reload，会冲突
Volar 和 Vue VSCode Tools 不能共存，ESLint 和 Prettier 不配好就会互相 undo，路径跳转失效往往不是插件问题而是配置没生效——这些细节比插件列表本身更重要。 
