VS Code保存HTML文件乱码应先点击右下角编码→选“通过编码重新打开”尝试GBK/GB2312/UTF-8 with BOM，内容正常后→再点右下角→“用编码保存”选UTF-8（无BOM），并确保html中含<meta charset="utf-8">。
保存HTML文件时编码乱码怎么办
VS Code 默认用 UTF-8 无 BOM 编码保存文件，但如果你从别处复制粘贴了含中文的 HTML 内容，或在其他编辑器里改过，打开后可能显示乱码、中文变方块、XXXX; 实体渲染异常——这基本是编码不匹配导致的。
解决方法很简单：编辑器右下角状态栏会显示当前编码（如 UTF-8 或 GBK），点击它 → 选 Reopen with Encoding → 尝试 GBK、GB2312 或 UTF-8 with BOM；确认内容正常后，再点右下角 → Save with Encoding → 固定选 UTF-8 保存。以后所有新 HTML 文件都应强制用 UTF-8，避免协作时出问题。
- 不要依赖“自动检测”，VS Code 的编码探测对混合内容（比如含注释的旧模板）经常失效
- 如果项目要部署到 Linux 服务器，
UTF-8 without BOM是唯一安全选择；BOM 会导致 PHP/Node.js 启动空白行或 JSON 解析失败 - 检查
html标签里是否漏了<meta charset="utf-8">—— 编码一致但页面仍乱码，八成是这个没写
右键“Open with Live Server”没反应？先查这几个地方
装了 Live Server 插件却右键菜单里没有 Open with Live Server，常见原因不是插件没装好，而是文件没被识别为 HTML。
确认以下三点：
立即学习“前端免费学习笔记（深入）”；
- 文件名必须以
.html或.htm结尾，index、page这类无后缀名的文件不会触发 HTML 模式 - 编辑器右下角语言模式必须是
HTML（不是Plain Text或PHP），点它手动切过去 - Live Server 插件安装后需重启 VS Code 才完全生效，尤其 Windows 上常有延迟加载问题
如果还是不行，按 Ctrl+Shift+P 输入 Live Server: Show Log，看控制台有没有报错，比如端口被占用（EADDRINUSE）或权限拒绝（Windows Defender 有时会拦截）。
用终端起本地服务比双击打开更可靠
直接双击 index.html 打开浏览器，看似快，但会遇到一堆限制：AJAX 请求跨域失败、fetch() 读取本地 JSON 报错、file:// 协议下 Service Worker 不可用——这些都不是 bug，是浏览器安全策略。
真正开发时，应该用本地 HTTP 服务，推荐两种零配置方式：
- 集成终端里运行：
python -m http.server 5500（Python 3 自带，无需额外安装） - 或：
npx serve -s（需全局装过serve，启动更快，支持 SPA 路由 fallback）
然后浏览器访问 http://localhost:5500。注意：此时必须用 http:// 开头，不能用 file://，否则调试工具里的 Network 面板看不到请求，CSS/JS 源码映射（source map）也失效。
保存时自动格式化 HTML 的隐藏开关
很多人以为 HTML 格式化要装 Prettier 插件才管用，其实 VS Code 内置的 HTML 格式化器已经够用，只是默认关着。
打开设置（Ctrl+,），搜 html format，勾选这两项：
-
HTML > Format: Enable（必须开） -
Files > Auto Save设为afterDelay或onFocusChange，配合上面格式化，就能“保存即整理”
另外，! + Tab 或 html:5 + Tab 可快速生成标准骨架，但要注意：如果光标不在空文件首行，生成的结构可能嵌套错位，建议新建文件后立刻敲 ! 再回车。
真正容易被忽略的是：当 HTML 里混写了内联 JavaScript 或 CSS，内置格式化器会把它们挤成一行。这种时候就得换 Prettier，并在 .prettierrc 里加 "htmlWhitespaceSensitivity": "ignore"，否则缩进和换行会反直觉。
