live server、prettier与eslint组合可覆盖90%前端效率痛点：live server通过端口配置和代理解决冲突与跨域；prettier与eslint需通过eslint-config-prettier对齐规则，避免格式来回修改；插件生效依赖项目级配置文件位置及语言模式正确识别。
Live Server + Prettier + ESLint 这三个插件组合，就能覆盖 90% 前端日常开发的效率痛点。其他插件不是不重要，而是容易装错、配错、冲突错。
Live Server 怎么避免端口冲突和跨域问题
默认启动在 5500 端口，但很多本地服务（如 Python 的 SimpleHTTPServer、Vite、Webpack Dev Server）也爱占这个口，一开就报 address already in use。
- 直接在
settings.json里设"liveServer.settings.port": 8080，或设为0让它自动选空闲端口 - 跨域调试 API 时别硬刷页面——用
"liveServer.settings.proxy"转发请求，比如把/api指向http://localhost:3000/api - 别依赖右键菜单的 “Open with Live Server”，它不读 proxy 配置；必须用工具栏的 “Go Live” 按钮或命令面板执行
Live Server: Start
Prettier 和 ESLint 一起用为什么总报格式冲突
常见现象是保存后代码来回跳：ESLint 提示加引号，Prettier 又删掉；ESLint 要分号，Prettier 把它抹了。这不是 bug，是规则没对齐。
- 先装
eslint-config-prettier，并在.eslintrc.js的extends末尾加上'prettier' - VS Code 设置里关掉
"editor.formatOnSave"对 ESLint 的启用（即不勾选eslint.format.enable），只留 Prettier 做格式化 - ESLint 只负责检查逻辑错误（如
no-unused-vars）、风格警告（如no-console），别让它碰缩进、引号、换行这些 Prettier 的地盘
Auto Rename Tag 在 JSX/Vue 里失效怎么办
插件默认只激活 html 语言模式，.jsx 或 .vue 文件里改 <div> 不会同步 <code>
