WebStorm本身不编译Sass，需全局安装Dart Sass（npm install -g sass）并配置File Watcher：Program填sass，Arguments加--source-map和--load-path，Watch patterns设为/.scss;/_.scss，Output paths填$FileNameWithoutExtension$.css;$FileNameWithoutExtension$.css.map。
WebStorm 本身不提供“Sass预处理器插件”这种独立安装的插件——它靠的是本地命令行编译器（sass） + 内置的 File Watchers 功能来实现自动编译，不是装个插件就完事。
WebStorm 不需要、也不能通过插件市场装 Sass 编译器
所谓“Sass 插件”在 JetBrains Marketplace 里并不存在真正意义上的编译能力插件。WebStorm 的 Sass/SCSS 支持是开箱即用的语法高亮、代码补全和文件监听能力，但编译动作完全交给外部命令行工具。你装再多插件，sass --version 在终端里跑不通，File Watcher 就永远触发不了编译。
- 别搜 “Sass plugin” 或 “SCSS compiler plugin”——这类搜索结果基本是过时信息或误导项
- WebStorm 自带的
File Watchers功能默认已启用，无需额外安装插件（只要File Watchers插件本身没被禁用） - 检查方式：
Settings → Plugins，确认File Watchers处于启用状态（它属于 bundled 插件，一般不会被关）
必须先装对 sass 命令行工具，否则 WebStorm 根本调不动
WebStorm 的 File Watcher 只是个“遥控器”，sass 才是真正的“发动机”。2026 年唯一推荐的方式是全局安装 Dart Sass：
- 执行
npm install -g sass（不是node-sass，它已废弃，不支持@use） - 终端运行
sass --version，输出类似1.77.2才算成功 - Windows 用户若用 PowerShell/CMD 能跑通，但 WebStorm 报
No such file or directory，大概率是 PATH 没继承——需在 WebStorm 启动脚本中显式补export PATH=... - macOS/Linux 用户常见坑：Homebrew 安装的
sass在/opt/homebrew/bin/sass，但 WebStorm 启动时没读到该路径
File Watcher 配置里 Program 字段填什么？
这个字段不是选模板就完事，它必须指向一个真实可执行的 sass 命令：
Miller CSV TSV JSON 数据处理器
下载
Miller (mlr) 是一个命令行工具，用于查询、整形和重新格式化名称索引数据，如 CSV、TSV、JSON 和 JSON Lines。它将 awk、sed、cut、join 和 sort 的功能整合到一个专为结构化数据处理而构建的单一工具中。
- 全局安装时：
sass（纯命令名，WebStorm 会按自身环境变量找） - 项目局部安装时：
$ProjectFileDir$/node_modules/.bin/sass（注意路径拼写，不能漏.bin） - 绝对路径也可，但不推荐——比如
/usr/local/bin/sass，换机器就得重配 - 千万别填
sass.bat或scss.bat（那是 Ruby Sass 时代的遗留物，Dart Sass 不提供 .bat 文件）
Watch patterns 和 Output paths to refresh 是最容易漏的关键项
这两个配置不对，_partial.scss 修改后不编译、生成的 .css.map 不刷新、DevTools 里点样式跳不到源文件——全是它们的问题：
-
Watch patterns默认是*.scss，必须改成**/*.scss;**/_*.scss，否则下划线开头的局部文件（如_mixins.scss）永远不会触发编译 -
Output paths to refresh必须填完整：$FileNameWithoutExtension$.css;$FileNameWithoutExtension$.css.map，少一个.map，source map 就失效 - 如果 CSS 输出到
css/子目录，路径要同步改：css/$FileNameWithoutExtension$.css;css/$FileNameWithoutExtension$.css.map
最常被忽略的其实是 Output paths to refresh 字段——它看着像提示，其实是硬性依赖；填错或留空，WebStorm 就不会重载生成的文件，编辑器里看到的永远是旧内容。
