Sublime Text 实现“保存即刷新”需三者协同：命令行 sass 监听文件、Sublime 正确调用、浏览器自动重载；常见问题源于 PATH 不可见、插件不监听子文件、未用 --watch 模式或未走本地服务器。
Sublime Text 本身不提供实时预览能力，所谓“保存即刷新”必须靠三块拼起来：外部 sass 命令行工具监听文件变化、Sublime 触发编译或转发路径、浏览器自动重载 CSS 或整页。少一块，就卡在“改了没反应”。
确认 sass 命令在 Sublime 里真能被找到
90% 的“保存无输出”问题，根源是 Sublime 启动时压根看不见 sass——它不读你终端的 $PATH，哪怕 sass --version 在 iTerm 里跑得飞起，Sublime 也当它不存在。
- macOS/Linux：终端运行
which sass，拿到类似/opt/homebrew/bin/sass或/usr/local/bin/sass的绝对路径 - Windows：运行
where sass，常见结果是C:\Users\Alice\AppData\Roaming\npm\sass.cmd - 关掉 Sublime，**从 Dock / 开始菜单重新启动**，再测试；否则旧环境变量还在缓存里
- 如果用 nvm 管 Node 版本，确保当前版本下已全局安装：
nvm use 20 && npm install -g sass
用 sass --watch 而不是插件“自动编译”来监听子文件变更
所有 Sublime 插件（LiveSassCompiler、EasyLess、SCSS）都只监听当前激活的 tab，@use "_variables" 或 @import "base" 文件改了，只要没切回去保存主文件，CSS 就不会更新。这不是 bug，是设计限制。
- 真正解决依赖变更重编译，必须用 CLI 的 watch 模式：
sass --watch src/scss:dist/css - 它会递归监听整个目录树，包括所有被
@use、@import引入的文件 - 插件里配的
output_dir或include_paths对--watch模式完全无效，那些只影响单次构建 - 别指望插件自动感知子文件变化；它们连
@use "utils"找不到路径时都静默失败，不报错也不生成 CSS
配置 SublimeOnSaveBuild + 自定义 .sublime-build 实现可控编译
比起封装过深的插件，手动配构建系统更透明、错误可见、新语法全支持，尤其对 @use、@forward 这类 Dart Sass 新特性。
将一个或多个 UI 原型图、线框图、产品截图或设计稿转换为标准化、可直接交付的 PRD 风格文档，供产品、设计、前端和测试共同使用。适用于 Codex 需要分析 PC 网页、桌面端、移动端、响应式页面、独立弹窗、表单、表格、看板、数据大屏或多页面流程截图，还原页面结构与交互，强制套用固定文档模板，抽取跨页面共享规则，或把一组原型沉淀为单页规范文档加整体业务流程文档的场景。不适用于纯视觉审美点评、代码实现、接口设计、埋点方案、竞品分析或无 UI 输入的业务需求创作。
立即学习“前端免费学习笔记（深入）”；
- 先装插件：
Ctrl+Shift+P→Package Control: Install Package→ 搜SublimeOnSaveBuild - 新建构建系统：
Tools → Build System → New Build System…，贴入：
{
"cmd": ["sass", "--no-source-map", "$file", "${file_path}/${file_base_name}.css"],
"selector": "source.scss, source.sass",
"path": "/opt/homebrew/bin:/usr/local/bin",
"file_regex": "^(.*?):([0-9]+):([0-9]+) (.*)$"
}
-
--no-source-map必须加，否则构建常卡住；需要 sourcemap 改用--embed-sources -
${file_path}/${file_base_name}.css是动态路径，避免多文件互相覆盖；别写死成style.css -
path字段填你本地which sass的父目录（macOS/Linux），Windows 填完整 npm prefix 路径，注意双反斜杠 - 右下角状态栏必须显示
SCSS或Sass，否则构建系统不匹配
浏览器端实现“改完即见”，靠 Live Server 或 BrowserSync
Sublime 不带浏览器预览功能，必须外接工具监听 CSS 变化并触发刷新。直接开文件（file://）会导致跨域或样式不加载，务必走本地服务器。
- 推荐
Live Server插件（Sublime 安装后需配合 VS Code？不对——这里指浏览器端方案）：实际更稳的是用终端起browser-sync - 终端执行：
browser-sync start --server --files "dist/css/*.css"，它会起一个本地服务并监听 CSS 变更 - 或者用
Live Server浏览器扩展（Chrome/Firefox），配合 Sublime 保存后自动刷新页面 - 关键点：确保
sass --watch输出的 CSS 路径和browser-sync监听的路径一致，否则改了也刷不出来
最容易被忽略的是：Sublime 启动方式、sass 的安装路径、以及 watch 模式与插件逻辑的根本冲突。三者任一出错，都会表现为“静默失败”——没报错、没输出、也没刷新。盯住这三点，比调十遍插件设置更省时间。
