必须用Live Server而非Open in Browser，因其通过本地HTTP服务（如http://localhost:5500）支持热重载、解决file://协议下fetch/ES模块/CORS等限制，而后者仅打开静态file://页面，无法满足现代前端开发刚需。
Live Server vs Open in Browser：热重载到底要不要？
热重载不是“锦上添花”，而是现代前端开发的刚需。Open in Browser 只是打开一个 file:// 协议的静态页面，改完 HTML/CSS/JS 后必须手动刷新；Live Server 启动的是本地 HTTP 服务（如 http://localhost:5500），支持保存即刷新、跨设备访问、自定义端口和 HTTPS 模拟。
常见错误现象：net::ERR_FILE_NOT_FOUND 或资源加载失败——这是用了 Open in Browser 打开含相对路径的 import 或 fetch 请求时的典型报错，因为浏览器禁止 file:// 协议发起跨域或模块请求。
- Live Server 默认端口为
5500，可在 settings.json 中配置："liveServer.settings.port": 3000 - 若需局域网访问（比如手机调试），启用：
"liveServer.settings.host": "0.0.0.0" - 禁用自动打开浏览器（避免干扰）：
"liveServer.settings.donotShowInfoMsg": true
Prettier 与 ESLint 冲突怎么解？
两者职责不同：ESLint 检查逻辑错误和编码规范（比如未使用的变量、no-console），Prettier 只管格式（空格、换行、引号）。直接同时启用会打架——例如 ESLint 要求双引号，Prettier 配了单引号，保存时反复来回改。
关键做法是让 ESLint “让位”给 Prettier 的格式规则，而不是反过来。官方推荐组合是：eslint-config-prettier 关闭所有 ESLint 的格式类规则，再用 eslint-plugin-prettier 把 Prettier 当作 ESLint 的一个规则来运行。
立即学习“前端免费学习笔记（深入）”；
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 安装依赖：
npm install --save-dev eslint-config-prettier eslint-plugin-prettier - .eslintrc.js 中
extends顺序很重要：Prettier config 必须放在最后，否则会被覆盖 - VSCode 设置里关掉
editor.formatOnSave对 JS/TS 文件的默认触发，改由 ESLint 插件接管格式化（需启用eslint.codeActionsOnSave.fixAll）
路径跳转失效？别怪 VSCode，先看 jsconfig.json
按住 Ctrl 点击 @/utils/request 却跳不到文件，不是插件没装，而是 VSCode 根本不知道 @ 指向哪里。Path Intellisense 和别名跳转插件都依赖项目级路径映射配置，而非插件自身硬编码。
必须在项目根目录下存在 jsconfig.json（TS 项目用 tsconfig.json），且包含合法的 baseUrl 和 paths：
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["src/*"],
"@api/*": ["src/api/*"]
}
},
"include": ["src/**/*"]
}
注意：baseUrl 是相对于 jsconfig.json 的路径，不是相对于工作区根目录；如果项目用了 Vite 或 Webpack 别名但没配 jsconfig.json，VSCode 就无法解析，此时装再多跳转插件也没用。
Vue / React 开发中，哪些插件真能省三秒以上？
不是所有“高亮”“补全”插件都值得开销。真正高频省时的只有三类：
-
Vue Language Features (Volar)（Vue 3）或Vetur（Vue 2）：提供<template>内表达式类型提示、v-model参数推导、defineProps自动补全——没它，写个props都要翻文档 -
Auto Rename Tag：改<div class="xxx">时自动同步闭合标签，对 JSX/Vue 模板有效，但对原生 HTML 文件默认不启用（需在设置里加"auto-rename-tag.activationOnLanguage": ["html", "vue", "javascriptreact"]） -
ES7+ React/Redux/React-Native snippets：输入rfc直接生成函数组件骨架，imrc生成带import React from 'react'的模板——比手敲快 5 秒，每天积少成多
别盲目装“Vue Helper”之类功能堆砌型插件：快捷键冲突、CPU 占用高、更新频繁导致行为突变，反而拖慢编辑器响应。稳定压倒炫技。
