live server 启动后页面不刷新或 go live 按钮没反应，根本原因不是插件损坏，而是它仅监听 .html、.htm、.xhtml 等静态文件保存事件，对 .vue、.jsx 或 dist 目录下构建产物默认不生效；必须确保打开的是根目录下已保存的 index.html，右键选择 open with live server，而非仅点状态栏 go live。
Live Server 启动后页面不刷新，Go Live 按钮没反应
根本原因不是插件坏了，而是它只监听 .html、.htm、.svelte 等静态文件的保存事件，对 .vue、.jsx 或构建产物（如 dist/index.html）默认不生效。
实操建议：
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 确认当前打开的是根目录下的
index.html，而不是构建后的文件或框架模板文件 - 右键点击 HTML 文件 → 选择
Open with Live Server，不要只点底部状态栏的Go Live - 若用 Vue/React 项目，改用
npm run dev启动官方开发服务器，Live Server 不适合替代 webpack/vite - 检查设置中是否误启用了
"liveServer.settings.donotShowInfoMsg": true，导致启动失败无提示
ESLint 报错但 Ctrl+S 不自动修复
ESLint 插件本身不负责格式化，只检测问题；自动修复需明确配置规则可修复性 + 绑定到保存动作。
实操建议：
- 在项目根目录添加
.eslintrc.js，确保包含"fixable"类规则（如'no-console': ['warn', { allow: ['warn', 'error'] }]） - VSCode 设置中启用：
"editor.codeActionsOnSave": { "source.fixAll.eslint": true } - 禁用与其他格式化工具（如 Prettier）的冲突：安装
eslint-config-prettier并在extends中最后引入 - 首次运行时可能提示“找不到 ESLint”，需在项目内执行
npm install eslint --save-dev
Prettier 格式化后引号/分号/换行和团队不一致
根本问题在于 Prettier 的配置未落地到项目级，VSCode 用户设置会覆盖项目配置，多人协作时极易错乱。
实操建议：
- 项目根目录必须存在
.prettierrc（JSON/YAML/JS 均可），内容如：{"semi": false, "singleQuote": true, "tabWidth": 2} - VSCode 设置中关闭全局格式化偏好：
"editor.defaultFormatter"设为"esbenp.prettier-vscode"，但不要设"prettier.semi"这类具体参数 - 加
.prettierignore排除node_modules/、dist/、build/，避免大文件卡顿 - CI 流程中加入
npx prettier --check .防止漏提交格式问题
路径别名（如 @/components）无法 Ctrl+Click 跳转
VSCode 默认不理解构建工具定义的别名，跳转失效是常态，不是插件没装对。
实操建议：
-
前端项目必须配
jsconfig.json（JS）或tsconfig.json（TS），含"baseUrl"和"paths" - 例如 Vue 项目：
"paths": { "@/*": ["src/*"] }，且"baseUrl": "./" - 装
Path Intellisense插件仅补全路径，不解决跳转；真正支持跳转的是 VSCode 自身的 TS/JS 语言服务 - 修改配置后必须重启 VSCode 或执行命令面板中的
Developer: Reload Window
jsconfig.json 少了个逗号，或 .eslintrc.js 导出对象写成了函数。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
