VS Code 开发 Vue/React 只需装关键扩展：Vue 用 Volar、Vue Language Features、ESLint；React 依赖 TypeScript 和 Prettier；需确保 PATH 包含 node_modules/.bin，并用浏览器自动附加调试。
VS Code 本身不内置 Vue 或 React 支持，但通过安装少量关键扩展和配置基础工具链，就能获得完整的语法高亮、智能提示、组件跳转、调试能力——不需要重装编辑器，也不用改系统环境。
Vue 开发必须装的三个扩展
只装这三项，就能覆盖 90% 日常开发需求。多装反而容易冲突或拖慢启动速度。
-
Volar：Vue 3 官方推荐的语言服务器，提供setup语法支持、ref/computed类型推导、.vue文件内 ` -
Vue Language Features (Volar)（即 Volar 的配套插件）：启用后才能在.vue文件中触发代码诊断和快速修复 -
ESLint：配合项目中的.eslintrc.js和eslint-plugin-vue，实时标出模板中 v-model 用法错误、响应式丢失等典型问题
如果项目是 Vue 2，改用 Vetur + ESLint，但需手动关闭 Volar 相关扩展。
React 开发靠 TypeScript + Prettier 就够用
React 官方不强制依赖特定 VS Code 插件，核心能力来自 TS 语言服务本身。只要项目有 tsconfig.json，VS Code 就能自动识别 JSX 类型、props 提示、hook 调用检查。
立即学习“前端免费学习笔记（深入）”；
- 确保已启用
TypeScript and JavaScript Language Features（VS Code 内置，勿禁用） - 装
Prettier扩展，并在设置中设为默认格式化工具："editor.defaultFormatter": "esbenp.prettier-vscode" - 可选装
ESLint，但必须配好eslint-plugin-react和eslint-plugin-react-hooks，否则大量 false positive 报错
不要装“Reactjs code snippets”之类纯模板类插件——现代脚手架（如 create-react-app、vite）生成的文件结构已足够规范，手动敲 rfc 快捷键反而打断思维流。
工具链不是装完就完事：检查 node_modules/.bin 是否在 PATH
VS Code 的终端（Terminal）能否识别 vite、npm run dev、eslint --fix 等命令，取决于它启动时读取的 PATH 环境变量。常见现象是：终端里运行正常，但 VS Code 底部状态栏点击“启动服务器”失败，报错 Command 'vite' not found。
- 在 VS Code 中按
Ctrl+Shift+P（macOS 为Cmd+Shift+P），输入Developer: Toggle Developer Tools，切换到 Console 标签页，执行process.env.PATH查看当前路径 - 对比系统终端中
echo $PATH输出，若缺失node_modules/.bin，说明 VS Code 是从桌面图标启动的，没继承 shell 配置 - 解决办法：从终端中执行
code .启动 VS Code，或在 macOS 中配置~/.zshrc加入export PATH="$PATH:$(npm config get prefix)/bin"
调试配置别硬套模板：优先用浏览器自动附加模式
不用手写 .vscode/launch.json。Vue / React 项目基本都基于 vite 或 webpack-dev-server，它们默认开启 sourcemap 并监听 3000/5173 端口，VS Code 可以直接附加。
- 启动开发服务器后（如
npm run dev），按Ctrl+Shift+P→ 输入Debug: Select and Start Debugging→ 选择Chrome或Edge→ 点击chrome://inspect页面里的“Configure”，添加{"url": "http://localhost:*"} - 之后断点会自动命中
.vue或.tsx源码，而非编译后的chunk-xxx.js - 如果始终无法停在源码，检查项目
vite.config.ts中是否设置了build.sourcemap: true（开发模式下默认开启，但某些自定义配置会关掉）
真正麻烦的从来不是装什么，而是扩展之间、编辑器与 shell、开发服务器与调试器这几层环境变量和路径的隐式耦合——每次新拉一个仓库，先确认 npm run dev 能跑起来，再打开 VS Code，比照着上面几条过一遍，基本就没大问题了。
