VS Code打开HTML文件无法实时预览是因为缺少Live Server插件；必须右键选择“Open with Live Server”启动HTTP服务，而非双击或拖入浏览器，否则仍是file://协议导致无法自动刷新。
VS Code 打开 HTML 文件不实时预览？装对插件才管用
VS Code 本身不带浏览器预览功能，直接双击打开 index.html 只会用系统默认浏览器打开静态文件，改完代码必须手动刷新——这不是配置问题，是缺了关键工具链。
真正能实现“保存即刷新”的，只有两类插件：Live Server（推荐）和 Auto Rename Tag（辅助）。前者启动本地 HTTP 服务，后者帮你少写错标签名，但不解决刷新问题。
-
Live Server必须通过右键菜单里的Open with Live Server启动，不能双击文件或拖进浏览器 - 它默认监听
http://127.0.0.1:5500，端口可改，但改完要重启服务，不是改配置就自动生效 - 如果页面报
net::ERR_CONNECTION_REFUSED，大概率是没点右键菜单，而是点了顶部的“在浏览器中打开”
HTML 语法高亮/自动补全失效？检查文件关联和设置
写 Tab 不补全
- 看右下角状态栏，确认语言模式显示的是
HTML，不是Plain Text或JavaScript - 点一下语言模式，选
Configure File Association for '.html'，确保.html关联到HTML - 如果用了自定义后缀（比如
.tpl），得手动加到files.associations设置里："*.tpl": "html"
保存时自动格式化 HTML 总崩坏？关掉 prettier 或调规则
很多人一保存， Hellostyle 拆成多行——这是 prettier 在发力，但它对 HTML 的默认规则并不适合所有场景。
- 检查是否启用了
editor.formatOnSave，以及默认格式化工具是不是esbenp.prettier-vscode - 不想禁用 prettier，就加配置：
"prettier.htmlWhitespaceSensitivity": "ignore"，避免它乱动换行和缩进 - 更轻量的选择：换成
HookyQR.beautify，它对 HTML 更“手稳”，但已停止维护，仅作临时替代
调试 JS 报错找不到 HTML 元素？路径和执行时机是关键
在 script.js 里写 document.getElementById('app') 返回 null，90% 不是 VS Code 配置问题，而是 HTML 加载顺序或路径出错。
- 确认
<script></script>标签在目标元素之后，或加defer属性：<script src="script.js" defer></script> - 如果用相对路径引入 JS，比如
src="./js/script.js"，确保文件夹结构和路径大小写完全匹配（Windows 不敏感，Linux/macOS 敏感） - VS Code 的
Live Server默认以项目根目录为服务器根路径，./指向的是你右键点击的文件所在文件夹，不是工作区根目录
最常被忽略的一点：VS Code 的 HTML 开发环境，本质上是个编辑器 + 插件组合，它不模拟浏览器环境，也不处理跨域、CORS、模块加载这些事。你看到的“运行效果”，其实是浏览器在跑，VS Code 只负责传文件——所以所有“为什么没反应”的问题，先问自己：浏览器地址栏里是 file:// 还是 http://？
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
