Live Server 必须配置 liveServer.settings.CustomBrowser 为 "chrome"（小写）才能指定 Chrome 为默认浏览器，而非依赖系统设置；配置后需重启 VS Code 或重载窗口才生效。
Live Server 要配 liveServer.settings.CustomBrowser 才能指定 Chrome
默认情况下，Live Server 启动后会用系统默认浏览器打开页面，但前端调试时往往需要固定用 Chrome（比如启用 DevTools、模拟设备、禁用缓存）。直接改默认浏览器不现实，尤其在多浏览器共存环境里。
正确做法是在 settings.json 里加这一行：
"liveServer.settings.CustomBrowser": "chrome"
注意：chrome 是小写，不是 Chrome 或 Google Chrome；如果装的是 Edge，填 edge；Firefox 填 firefox。填错会导致启动失败，控制台报错 Cannot find browser 'xxx'。
常见坑：
立即学习“前端免费学习笔记（深入）”；
- 拼写错误（大小写、空格、中文引号）
- 没重启 VSCode 或没重载窗口（
Developer: Reload Window） - 路径含空格的浏览器（如某些国产 Chromium）不被识别，得换标准版 Chrome
Prettier 和 ESLint 冲突时，优先关 eslint-config-prettier
两者都干格式化的事，但逻辑不同：ESLint 检查代码质量，Prettier 只管样式。一旦同时开启“保存时格式化”，常出现光标乱跳、分号反复增删、引号来回切换等问题。
根本解法不是调顺序，而是让 ESLint 主动让位：
- 装
eslint-config-prettier包（不是插件） - 在
.eslintrc.js的extends数组末尾加上'prettier' - 确保
prettier在eslint-config-prettier之后加载
示例片段：
module.exports = {
extends: ['airbnb', 'plugin:prettier/recommended', 'prettier']
};
别漏掉 'prettier' 这一项——它才是真正关闭 ESLint 格式类规则的开关。
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
Path Intellisense 的 path-intellisense.mappings 必须匹配 jsconfig.json
别名路径（如 @/components/Button.vue）跳转失效，90% 是因为插件映射和项目配置不一致。VSCode 自带的跳转靠 jsconfig.json，而 Path Intellisense 默认不读这个文件，得手动告诉它。
在用户设置或工作区设置里加：
"path-intellisense.mappings": {
"@": "${workspaceFolder}/src"
}
注意点：
-
${workspaceFolder}是变量，不能写死成绝对路径 - 如果项目用
tsconfig.json，插件不会自动识别，仍要配这里 - 多个别名要全列出来，比如
"@assets": "${workspaceFolder}/src/assets"
配完立刻生效，不用重启，但 Ctrl+Click 跳转失败时先检查这个映射是否漏了斜杠或大小写。
Vue VS Code Tools 插件必须开 vue.suggestions.autoImport
Vue 单文件组件里写 <el-button> 却没自动 import，不是插件没装，而是默认关掉了自动导入。这个开关藏得深，新手常忽略。
打开设置搜 vue.suggestions.autoImport，勾选即可。它依赖 unplugin-auto-import 或 unplugin-vue-components 的运行时配置，但插件层只管触发，不负责生成声明文件。
容易卡住的地方：
- 项目没装
unplugin-auto-import，开了也白开 -
auto-import.d.ts被 gitignore 了，TS 类型提示就断了 - Vue 版本是 2.x，但插件默认适配 Vue 3，得切到兼容模式
复杂点在于：自动 import 是编辑器行为 + 构建工具行为的组合结果，缺一不可。单侧配置成功，另一侧不配合，最终还是没效果。
