前端开发者真正需要的VSCode插件是ESLint、Prettier、Live Server、Path Intellisense和Volar，分别解决代码错误标红、保存自动格式化、静态服务启动、路径智能补全和Vue3语法提示五大核心问题。
前端开发者真正需要的 VSCode 插件，不是越多越好，而是得能解决具体问题：跳转失效、格式混乱、类名记不住、保存后代码还是歪的、改个 v-model 忘了同步结束标签……下面这几个插件，装上就能立刻见效，且彼此不打架。
ESLint 集成必须开，但别只装插件不配规则
装了 ESLint 插件却没报错？大概率是项目里缺 .eslintrc.js 或 .eslintrc.cjs。VSCode 的 ESLint 扩展只是“显示器”，真正的校验逻辑靠本地安装的 eslint 包和配置文件驱动。
- 必须在项目根目录运行
npm init @eslint/config（或yarn create @eslint/config）生成配置，不能只依赖插件默认规则 - Vue 项目建议选
plugin:vue/vue3-recommended，React 项目加plugin:react/recommended - 如果用了 TypeScript，要额外安装
@typescript-eslint/eslint-plugin并在配置中启用 - 插件设置里开启
eslint.enable和eslint.run（设为onType而非onSave，否则改一行等半秒才提示）
Prettier 格式化要接管 editor.defaultFormatter，否则 save 时无效
很多人装了 Prettier 插件，也开了 editor.formatOnSave，但保存后代码毫无变化——根本原因是 VSCode 没把 Prettier 设为默认格式化器。
- 必须在设置里搜
defaultformatter，把editor.defaultFormatter明确设为esbenp.prettier-vscode - 若同时用 ESLint，需装
eslint-config-prettier并在 ESLint 配置中extends它，否则两者规则会冲突（比如分号、引号） -
.prettierrc中推荐写明"semi": false和"singleQuote": true，避免团队成员本地设置覆盖项目规则 - HTML 文件默认不被 Prettier 格式化，需在
prettier.documentSelectors中手动加"**/*.html"
Live Server 启动后页面空白？检查 webRoot 和端口占用
Live Server 点一下就起服务，但常遇到 404 或白屏，多数不是插件问题，而是路径或环境没对齐。
立即学习“前端免费学习笔记（深入）”；
- 右键 HTML 文件 → “Open with Live Server” 时，它默认以该文件所在目录为根目录启动服务；如果项目结构是
src/index.html，而你右键的是dist/index.html，就会找不到资源 - 可在
settings.json中配置"liveServer.settings.root": "./src"统一指定根路径 - 启动失败时看右下角状态栏，若显示 “Address already in use”，说明端口被占，可改
"liveServer.settings.port": 5501 - 它不处理路由（如访问
/user会 404），纯静态服务，SPA 项目需配合 webpack-dev-server 或 Vite
别名路径跳转（@/xxx）失效？插件 + tsconfig.json 缺一不可
@/api/user 按住 Ctrl 点不了？光装 Path Intellisense 或 Vue Alias Skip 不够，TypeScript 项目必须让编辑器知道 @ 指向哪。
- 确保项目根目录有
tsconfig.json，其中compilerOptions.baseUrl设为"."，paths包含"@/*": ["src/*"] - VSCode 默认读取
tsconfig.json做路径解析，不用额外插件也能跳转；插件只是补位（比如 JS 项目没 tsconfig） - 如果用了 Vite，还需在
vite.config.ts的resolve.alias里写同样映射，否则运行时可能报错 - 修改
tsconfig.json后，必须重启 VSCode 窗口（不是重载），否则缓存路径不更新
插件不是魔法，它只是把底层配置暴露成点按操作。真正卡住人的，永远是 tsconfig.json 里少了个逗号、.eslintrc 里 extends 写错名字、或者 settings.json 里那个没生效的 defaultFormatter 字段。
