Sublime Text 本身不实现实时预览，所谓“实时”必须靠外部工具链协同完成；直接双击 HTML 文件、用 Open in Browser 插件或依赖 file:// 协议打开，90% 的样式/脚本更新都不会生效——这是浏览器安全机制和协议限制所致。
Sublime Text 本身不实现实时预览，所谓“实时”必须靠外部工具链协同完成；直接双击 HTML 文件、用 Open in Browser 插件、或依赖 file:// 协议打开，90% 的样式/脚本更新都不会生效——这不是配置问题，是浏览器安全机制和协议限制。
为什么 Live Server 插件是最稳的入门选择
Live Server 是纯 Python 实现的轻量 HTTP 服务，不依赖 Node.js，也不需要命令行操作。它绕过了 file:// 协议的所有坑：跨域拦截、相对路径解析失败、缓存无法控制。
- 必须在 Sublime 中通过 File → Open Folder 打开整个项目根目录，不能只打开单个
index.html - 右键点击 HTML 文件，选 Open with Live Server（不是 Ctrl+Click 链接）
- 检查浏览器地址栏是否为
http://127.0.0.1:5500/这类http://开头地址，不是file:// -
<link>中的href必须用相对路径，例如href="style.css"，不能写file:///xxx或绝对路径 - 开发时建议打开 DevTools（
F12），在 Network 标签页勾选Disable cache，避免 CSS/JS 被内存缓存
LiveReload 为什么经常“静默失败”
LiveReload 插件在 Sublime 里只是个信号发射器，真正干活的是 Chrome 扩展。它不启动服务、不托管文件、也不处理刷新逻辑——所以装错扩展、端口不一致、协议不对，都会导致“保存了但页面不动”。
- Chrome 必须安装官方 LiveReload 扩展，并点击地址栏图标使其变为实心（表示已启用）
- 当前页面必须用
http://或https://打开；file://下扩展会被浏览器直接禁用 - Sublime 中需手动执行
LiveReload: Enable/Disable命令（Ctrl+Shift+P输入），否则插件不监听文件变化 - 插件设置中
"enabled_plugins"至少包含"SimpleRefresh"，否则只发/changed请求，不触发刷新 - 默认端口是
35729，若被占用需同步修改 Sublime 插件配置和 Chrome 扩展端口设置
BrowserSync 适合多设备调试但配置稍重
BrowserSync 自带 HTTP 服务器、文件监听、CSS 注入和跨设备同步能力，比 LiveReload 更接近 VS Code 的体验，但引入了 Node.js 依赖和更多配置点。
立即学习“前端免费学习笔记（深入）”；
- 全局安装：
npm install -g browser-sync；如提示command not found，说明 Node 全局路径未加入环境变量，可改用npx browser-sync - 进项目根目录运行：
browser-sync start --server --files "*.html, *.css, *.js"；注意--files参数必须显式列出后缀，通配符不递归子目录（要写成"**/*.css"） - 浏览器访问
http://localhost:3000，此时 Sublime 保存任意匹配文件，页面立即刷新 - 如希望保存更顺手，可在 Sublime
Preferences → Settings中加一行："save_on_focus_lost": true - 局域网内手机访问
http://192.168.x.x:3000可同步滚动和点击，但需确保防火墙放行端口
MarkdownPreview 自动刷新的硬性前提
MarkdownPreview 默认是手动模式，所谓“自动刷新”其实是靠浏览器标签页接收刷新指令——但它不会自己开新标签，也不会修复路径问题。
- 必须先手动执行一次
Markdown Preview: Preview in Browser，否则没有目标标签页可刷新 - 浏览器必须用
file://或http://127.0.0.1打开生成的 HTML；http://localhost有时因端口冲突失败 - 插件配置中开启
"enable_autoreload": true，但该功能对中文路径、空格、特殊字符极其敏感 - 路径含中文或空格时，预览常卡死或报错
UnicodeEncodeError；建议项目路径全用英文+下划线 - 实际工作中，绑定快捷键（如
Ctrl+Alt+M）手动刷新，比折腾自动同步更稳定
真正容易被忽略的，不是“怎么装”，而是协议、路径、启用状态这三者的耦合关系——http:// 不是可选项，是必要条件；相对路径不是习惯问题，是浏览器解析规则；而“已启用”这个状态，在 LiveReload 和 BrowserSync 里都得手动确认，不是装完就自动生效。
