VSCode前端开发需精准配置插件与文件：ESLint+Prettier必须协同并用eslint-config-prettier消歧；jsconfig.json/tsconfig.json须正确配置baseUrl/paths以支持路径跳转；Live Server仅适用于静态页，Vue/React项目须用对应CLI启动；Volar等插件依赖项目级识别与配套工具链。
VSCode 本身不带前端开发支持，装对插件才能让编辑器真正“活”起来——不是所有插件都值得装，关键看它能不能解决你正在写的代码里真实存在的问题。
ESLint + Prettier 组合为什么必须一起配
单独装 ESLint 会报格式错误但不自动修；只装 Prettier 又不管逻辑问题（比如 no-unused-vars 或 react/prop-types）。两者冲突点集中在分号、引号、括号换行等格式规则上。
- 必须用
eslint-config-prettier关闭 Prettier 覆盖的 ESLint 规则，否则保存时反复打架 -
prettier的printWidth设为 80，tabWidth设为 2，和主流团队保持一致 - 在
.eslintrc.js中extends顺序不能错：先写框架规则（如plugin:vue/vue3-recommended），再写prettier，否则会被覆盖 - VSCode 设置里关掉
editor.formatOnSave，改用 ESLint 的eslint.format.enable，避免格式化和校验脱节
路径跳转失效时优先检查 jsconfig.json / tsconfig.json
按住 Ctrl 点击 @/components/Button.vue 没反应？不是插件没装，而是别名没被语言服务识别。
-
Path Intellisense只补全路径，不负责跳转；真正驱动跳转的是 VSCode 内置的 TS/JS 语言服务 - 必须在项目根目录有
jsconfig.json（JS 项目）或tsconfig.json（TS 项目），且含compilerOptions.baseUrl和paths - 如果用了 Vite，确认
vite.config.ts里的resolve.alias和tsconfig.json里的paths完全一致，大小写、斜杠方向都不能错 - 改完配置后要重启 VSCode 窗口，仅重载窗口不够
Live Server 不能替代真实开发服务器
它只是静态文件服务器，不处理模块解析、环境变量、代理转发——开 index.html 没问题，但跑 Vue/React 项目会直接白屏或报 Failed to load module script。
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
立即学习“前端免费学习笔记（深入）”；
- Vue CLI / Vite / Create React App 项目，一律用对应 CLI 的
npm run dev启动，而不是点Go Live - Live Server 唯一可靠场景：纯 HTML/CSS/JS 静态页、原型稿预览、Markdown 导出的 HTML
- 端口冲突不是主要风险，真正的坑是它不读
vite.config.ts里的server.proxy，调 API 必挂 - 如真需本地服务，建议直接用
npx serve -s dist（build 后）或npx http-server -p 8080
Vue/React 插件不是装了就生效
官方插件（如 Vue Language Features (Volar)）依赖项目类型识别——如果打开的是单个 .vue 文件而非整个项目，语法高亮和跳转会降级为纯文本模式。
- Volar 必须配合
vue-tsc全局安装，否则template中的表达式类型检查不工作 - React 开发者别装旧版
ES7+ React/Redux/GraphQL/React-Native snippets，它和 TypeScript 的 JSX 类型推导冲突，导致useState返回值类型丢失 - 组件自动导入（如
vue.components.autoImport）只在script setup语法下生效，Options API 需手动 import - 插件启用后，右下角状态栏要显示 “Vue (Volar)” 或 “TypeScript React”，否则说明语言模式没切对
插件越多，越容易掩盖配置问题。真正卡住开发的，往往不是缺某个炫酷功能，而是 jsconfig.json 少了一行 paths，或是 .eslintrc.js 里多了一个逗号。
