Sublime Text安装并配置Sass预编译器的调试运行路径-sublime-PHP中文网

sublime text 找不到 sass 命令的根本原因是未继承 shell 的 path，解决方法是通过插件设置或自定义 build system 显式指定 sass 可执行文件的绝对路径，并注意 json 格式、dart sass 与 ruby sass 区分、include_paths 配置及 @use 路径解析规则。

sublime text安装并配置sass预编译器的调试运行路径

Sublime Text 找不到 `sass` 命令，根本原因是没继承 shell 的 PATH

你在终端里能跑 sass --version，但 Sublime 保存 .scss 文件时却报 command not found: sass——这不是插件问题，是 Sublime 启动时压根没拿到你 shell 配置的环境变量。macOS/Linux 图形界面下尤其常见；Windows 上则多因 Node.js 装在用户目录（比如 C:\Users\Me\AppData\Roaming\npm\sass.cmd），而系统 PATH 没包含它，或用了 nvm 切换版本后路径失效。

解决办法只有一个：不依赖 PATH，直接告诉 Sublime sass 在哪。

先在终端运行 which sass（macOS/Linux）或 where sass（Windows），拿到绝对路径，例如：/opt/homebrew/bin/sass 或 C:\Users\Me\AppData\Roaming\npm\sass.cmd
打开 Sublime → Preferences → Package Settings → Sass → Settings（如果是 Less，就选 Less → Settings）
在右侧用户设置里写入："sass_path": "/opt/homebrew/bin/sass"（注意只填可执行文件路径，别带参数）
保存后重启 Sublime，再试保存 .scss 文件

用自定义 Build System 调试 `sass` 运行路径更直观

比起插件配置，Build System 是最可控、也最容易看到错误输出的方式。它强制你显式写出命令和路径，出错时控制台会直接打印 stderr，比如 Cannot find module 'sass' 或 Permission denied，比插件静默失败好排多了。

操作步骤：

菜单栏 → Tools → Build System → New Build System…

粘贴以下内容（适配 Dart Sass，支持 source map 和压缩）：

{
  "cmd": ["sass", "--sourcemap", "$file:$file_path/../dist/css/${file_base_name}.css"],
  "selector": "source.scss",
  "shell": true,
  "working_dir": "$file_path"
}

保存为 Sass-debug.sublime-build，放在 Packages/User/ 目录下
打开一个 .scss 文件，选中这个构建系统，按 Ctrl+B（Windows/Linux）或 Cmd+B（Mac）

如果报错，控制台（Ctrl+`）里会显示完整命令执行过程。重点看两处：sh: sass: command not found 说明路径不对；Error: Can't find stylesheet to import 说明 @use 或 @import 路径解析失败，跟 include_paths 有关。

Sublime Text Build Linux版

Sublime Text Linux x86-64 deb 安装包。官方也提供 rpm、tar.xz 和软件源安装方式。

下载

`sass_path` 配错或没生效的三个典型表现

即使你填了 sass_path，也可能因为几个细节被忽略而白配：

sass_path 值末尾多了一个空格，或用了中文引号（“”），JSON 解析失败，设置根本不加载
你装的是 Dart Sass，但路径指向了旧版 Ruby Sass（比如 /usr/local/bin/sass），而 Ruby Sass 已弃用，不支持 @use，编译会卡在变量未定义
macOS 上用 Homebrew 安装 Dart Sass，路径可能是 /opt/homebrew/bin/sass（Apple Silicon）或 /usr/local/bin/sass（Intel），which sass 必须在图形界面终端里运行，否则可能返回错误路径

验证是否生效：打开 Sublime 控制台（Ctrl+`），输入 view.window().run_command("sass_build")（假设你用的是 Sass 插件），如果报 AttributeError 或 KeyError，说明插件根本没读到你的 sass_path 设置。

调试时别忽略 `include_paths` 和 `@use` 路径解析逻辑

就算 sass 命令能跑，改了 _variables.scss 后保存主文件仍报 undefined variable，大概率不是路径问题，而是模块导入没对上。

Dart Sass 的 @use 默认只认当前文件所在目录及其子目录。如果你的结构是 src/scss/main.scss 引用了 src/scss/base/_variables.scss，那没问题；但若引用的是 src/scss/_variables.scss（同级），就得配 include_paths。

在 Build System 的 cmd 里加参数："sass", "--load-path=src/scss", "$file:..."
LiveSassCompiler 用户可在设置里加："live_sass_compiler.settings.includePaths": ["src/scss"]
注意：@use "base/variables" 中的路径是相对 include_paths 的，不是相对当前文件

真正容易被忽略的是：Dart Sass 不支持从 node_modules 直接 @use "bootstrap"，除非你明确加了 --load-path=node_modules，且 bootstrap 是以 Sass 模块方式发布的（不是老式 CSS 导入）。这点和 Webpack 的 resolve.alias 完全不同，不能套用经验。