Live Server启动失败或不刷新，根本原因是未通过“文件→打开文件夹”建立工作区，导致插件无法激活；须确保已保存的.html文件位于工作区中、右下角显示Go Live，且关闭防病毒软件拦截。
Live Server 启动失败或不刷新怎么办
Live Server 插件不是装完就能用，常见问题是右键没“Open with Live Server”选项，或保存后浏览器不自动刷新。根本原因通常是项目没在正确上下文里启动。
- 必须通过
File → Open Folder打开整个项目文件夹，不能只打开单个index.html文件——否则插件无法监听文件变更 - 检查右下角状态栏是否显示
Live Server正在运行；没显示就说明没启动，右键菜单也不会出现 - 如果已启动但不刷新，确认设置了
files.autoSave为afterDelay或onFocusChange，纯手动Ctrl+S才触发刷新 - 某些防病毒软件或系统代理会拦截本地
http://127.0.0.1:5500请求，可临时关闭测试
Auto Rename Tag 修改标签后另一侧没同步
这个插件默认只对标准 HTML 标签生效，遇到自定义组件（如 <MyButton>）或 JSX 语法时不会响应，不是 bug，是设计如此。
- 仅支持成对的、闭合的 HTML/XML 标签，
<input>这类自闭合标签不参与重命名 - Vue 的
<template>块内有效，但 SFC 中的<script>或<style>区域无效 - React JSX 中，只有原生标签（
<div>、<span>）能被识别，<Button>这类首字母大写的组件名会被忽略 - 若想强制启用，可在设置里搜索
autoRenameTag，把html.autoRenameTag设为true，但对非 HTML 文件无作用
ESLint + Prettier 冲突导致保存后代码乱跳
两者都抢着格式化 JS/TS 文件，结果一个加引号、一个去引号，一个换行一个压行，最终保存时反复“打架”。这不是配置错误，是职责重叠。
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 不要同时启用
eslint.format.enable和prettier.requireConfig—— 选一个作为主力格式器 - 推荐用 ESLint 做校验 + 修复（
eslint.codeAction.showDocumentation开启），Prettier 仅做保存时格式化（关掉 ESLint 的 auto-fix on save） - 在
.eslintrc.cjs里加extends: ['plugin:prettier/recommended']，让 ESLint 主动兼容 Prettier 规则 - VS Code 设置中禁用
editor.formatOnSave，改用editor.codeActionsOnSave配置为{"source.fixAll.eslint": true}
vscode-icons 显示异常或图标不更新
装完插件图标没变，或者 .vue/.tsx 文件还是默认文档图标，大概率是主题或文件关联没生效。
立即学习“前端免费学习笔记（深入）”；
- 安装后必须重启 VS Code，仅重载窗口（
Developer: Reload Window）不够 - 确认已启用图标主题：按
Ctrl+Shift+P输入Preferences: File Icon Theme，选VSCode Icons - 某些工作区设置（
.vscode/settings.json）里写了"workbench.iconTheme": null，会覆盖全局设置 - Vue 单文件组件需要额外支持：确保已安装
Volar（非旧版 Vetur），否则.vue文件类型识别失败，图标 fallback 到普通文本
