必须先确保 dart sass 全局安装且终端可执行，再配置 phpstorm file watcher；program 填 sass，arguments 用 --style=expanded --no-source-map $filename$:$filenamewithoutextension$.css，working directory 设为 $projectfiledir$，output paths 填 $filenamewithoutextension$.css。
能自动编译，但前提是 sass 命令在终端里能直接跑通；否则 PhpStorm 的 File Watcher 只是空转，连报错都不一定显示。
确认 Dart Sass 已全局安装且可用
PhpStorm 的 File Watcher 本质是调用命令行工具，它自己不带编译器。所以第一步不是打开设置，而是打开终端敲：
sass --version
如果返回类似 1.77.2 的版本号，说明装对了；如果报 command not found 或 ‘sass’ is not recognized，就别往下配了——先解决环境问题。
- 必须用
sass（Dart Sass），不是已废弃的ruby-sass或过时的node-sass - 安装方式：运行
npm install -g sass，确保全局可执行 - Windows 用户若用 Git Bash/WSL 启动 PhpStorm，注意它默认可能走 CMD 环境；此时
Program字段得填绝对路径，比如C:\Users\XXX\AppData\Roaming\npm\sass.cmd - macOS/Linux 用户若用
nvm，请从终端执行open -a PhpStorm启动，否则 PHPStorm 可能读不到 shell 的PATH
File Watcher 配置关键字段不能错位
PhpStorm 创建的预设模板只是起点，Arguments、Working directory、Output paths to refresh 这三项一错，编译就静默失败或输出错乱。
-
Program：填sass（推荐）或完整路径；别填sass.bat或scss.bat（那是 Ruby 时代的老路） -
Arguments：典型写法是--style=expanded --no-source-map $FileName$:$FileNameWithoutExtension$.css；要 source map 就把--no-source-map换成--source-map（注意大小写和连字符，sass不认--sourcemap） -
Working directory：固定设为$ProjectFileDir$；设成$FileDir$容易因相对路径崩掉 -
Output paths to refresh：只填$FileNameWithoutExtension$.css；别写**/*.css，否则改一个_mixins.scss可能刷出一堆无关 CSS 标签
修改 _partial.scss 文件不触发编译？这是正常行为
File Watcher 默认只监听「入口文件」，即不以下划线开头的文件（如 main.scss）。像 _variables.scss、_layout.scss 这类被 @import 的 partial，改了不会自动重编译——因为 PhpStorm 不分析 import 依赖图。
- 这不是 bug，是设计限制；它不像 Webpack 那样做依赖追踪
- 强行让 partial 触发编译的办法（不推荐）：在
Arguments里硬编码所有入口，例如main.scss:main.css _theme.scss:_theme.css，但维护成本高 - 更实际的做法：保存
main.scss（哪怕只加个空格），强制触发一次全量编译 - 如果项目规模大、partial 多，建议把构建逻辑移出 IDE，改用
npm run watch+sass --watch，更可靠
最容易被忽略的是 Working directory 和终端环境的一致性：你能在终端跑通 sass --version，不代表 PHPStorm 能继承同一套环境变量；尤其在 macOS 使用 nvm、Windows 切换不同 shell 时，这个断层几乎必现。
php免费学习视频：立即使用
踏上前端学习之旅，开启通往精通之路！从前端基础到项目实战，循序渐进，一步一个脚印，迈向巅峰！
