Sublime Text 本身不支持实时渲染 SCSS，所谓“实时”只能靠外部 sass 命令行工具 + 插件组合实现监听与自动编译，浏览器刷新还需额外配合 LiveReload；真正在编辑器里看到样式变化，必须走终端 sass --watch 这条路。
Sublime Text 本身不支持实时渲染 SCSS，所谓“实时”只能靠外部 sass 命令行工具 + 插件组合实现监听与自动编译，浏览器刷新还需额外配合 LiveReload；真正在编辑器里看到样式变化，必须走终端 sass --watch 这条路。
为什么 SCSS 文件保存后没生成 CSS？
核心问题往往不是插件没装，而是底层 sass 命令根本不可用或路径错位：
- 在终端运行
sass --version，无输出或报command not found→ 说明 Dart Sass 没装或没进PATH - Windows 用户注意：
sass.cmd路径常为C:\Users\XXX\AppData\Roaming\npm\sass.cmd，不能只写sass - macOS 用户若用 Homebrew 安装，路径通常是
/opt/homebrew/bin/sass（Apple Silicon）或/usr/local/bin/sass - Sublime 启动时读取的是它自己的环境变量，不是你终端的——重启 Sublime 才能生效新 PATH
LiveSassCompiler 插件点“Watch Sass”没反应？
这个插件看似一键，但默认行为很保守：它只对当前打开的、已保存的 .scss 文件生效，且不自动监听子目录：
- 右下角状态栏必须显示
Sass（不是CSS或Plain text），否则语法未识别，插件直接跳过 - 文件名不能带空格或中文，路径也不能含中文——比如
C:\项目\style.scss会静默失败 - 配置中
"saveTo":"/css/"是相对项目根目录的，不是相对 SCSS 文件；若没开项目（即没用Project → Open Project），该路径会失效 - 插件默认排除
node_modules和隐藏目录，但如果你的 SCSS 在src/scss/下，而入口文件是main.scss，它不会自动编译_partial.scss—— 只有不含下划线前缀的文件才触发
想真正监听整个 scss/ 目录并自动刷新浏览器？
别依赖插件做监听，直接在终端跑 sass --watch，再配 LiveReload 浏览器扩展：
立即学习“前端免费学习笔记（深入）”；
- 终端进入项目根目录，执行：
sass --watch scss/:css/（输入目录后加冒号，再写输出目录） - 确保
scss/下有合法入口文件（如main.scss），且不含语法错误，否则监听立即退出 - 浏览器装 LiveReload 扩展，页面中插入
<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></script>');或用本地服务器自动注入 - 不要在 Sublime 里同时开多个监听插件（如 LiveSassCompiler + SublimeOnSaveBuild），它们会争抢文件锁，导致编译卡住或输出为空
最容易被忽略的一点：Dart Sass 默认禁用 @import，遇到 Invalid CSS after "@import" 不是插件问题，是你 SCSS 里写了旧语法。要么改用 @use，要么在 sass --watch 命令后加 --legacy-flag（仅限过渡期）。
