Sublime Text 需通过 SCSS 插件调用 dart-sass 实现编译，不支持原生实时监听；须配置绝对 sass_path、output_dir 等参数，保存或 Ctrl-B 触发单次编译，真 --watch 应交由终端独立运行。
Sublime Text 本身不支持 Sass/SCSS 实时编译，必须借助插件 + 外部编译器（如 sass CLI 或 dart-sass）配合实现。关键不是“装个插件就自动实时”，而是配对路径、监听逻辑和输出行为。
确认系统已安装 dart-sass
Sublime 插件（如 SCSS 或 Sass）只是调用命令行工具，不自带编译器。旧版 node-sass 已废弃，dart-sass 是当前唯一推荐的官方实现。
- 运行
sass --version检查是否可用；若报错，先通过npm install -g sass安装 - Windows 用户注意：确保
sass命令在系统 PATH 中，或记下完整路径（如C:\Users\XXX\AppData\Roaming\npm\sass.cmd） -
macOS/Linux 用户若用
homebrew安装，路径通常是/opt/homebrew/bin/sass（Apple Silicon）或/usr/local/bin/sass
安装并配置 SCSS 插件（推荐）
Package Control 中搜索安装 SCSS（作者：mrmartineau），它比老版 Sass 插件更轻量、兼容性更好，且默认支持 dart-sass。
- 安装后无需重启，但需手动配置编译命令路径：菜单栏
Preferences → Package Settings → SCSS → Settings - 在右侧用户设置中添加：
{ "sass_path": "/usr/local/bin/sass", "output_dir": "./css", "save_on_build": true, "style": "compressed" } -
sass_path必须是绝对路径，不能写sass（除非确认 Sublime 的环境变量包含该命令） -
output_dir是相对路径（相对于当前文件所在目录），支持../dist/css这类写法
触发编译的三种方式及区别
没有真正“后台实时监听”，所谓“实时”其实是保存即编译（save_on_build）或手动触发，依赖你是否启用对应选项。
立即学习“前端免费学习笔记（深入）”；
- 按
Ctrl+B（Windows/Linux）或Cmd+B（macOS）：执行一次编译，生成 CSS 文件（即使未保存） - 保存文件（
Ctrl+S）：仅当save_on_build设为true时才触发编译 - 右键菜单 →
Build With → SCSS：等效于Ctrl+B，适合临时切换构建系统 - ⚠️ 注意：
SCSS插件不支持--watch模式，无法像 CLI 那样后台监听文件变动——这是 Sublime 架构限制，不是配置问题
常见错误与绕过方案
编译失败通常不是插件问题，而是路径、语法或权限导致，错误信息会直接显示在 Sublime 底部状态栏或弹窗中。
-
File not found: sass：sass_path路径错误，或权限不足（macOS/Linux 可试chmod +x /path/to/sass） -
Invalid CSS after "...": expected 1 selector or at-rule：SCSS 语法错误（比如漏了$、缩进错、括号不匹配），插件不会高亮具体行，需靠 CLI 复现定位 - 输出 CSS 空文件或内容未更新：检查
output_dir是否可写，或是否存在同名.css.map文件锁住写入 - 真要
--watch？单独开终端运行sass --watch src/style.scss:dist/style.css，让 Sublime 专注编辑，别强求它做构建工具的事
Sublime 的优势是快和轻，硬塞实时监听反而增加不稳定因素。把编译交给终端或专用构建工具（如 vscode 的 Live Sass Compiler 扩展），Sublime 保持编辑主力，是最省心的分工方式。
