无法在 WebStorm 中编译 SCSS

Question

我正在使用 node-sass 将 scss 文件编译为 WebStorm 内的 css。

这些是我在我的目录中的设置。

程序：

/usr/local/bin/node-sass

参数：

--output $ProjectFileDir$/css/ --compile --map $FileName$

要刷新的输出路径：

$ProjectFileDir$/css/$FileNameWithoutExtension$.css:$ProjectFileDir$/css/$FileNameWithoutExtension$.map

我希望将 css 文件写入根目录下的 css 目录中。然而，这是我从 WebStorm 中得到的编译错误

/usr/local/bin/node-sass --output /Users/melissa/Dropbox/codepen/sample/core-fe/css/ --compile --map styles.scss
path.js:28
    throw new TypeError('Path must be a string. Received ' + inspect(path));
    ^

TypeError: Path must be a string. Received undefined
    at assertPath (path.js:28:11)
    at Object.extname (path.js:1471:5)
    at getOptions (/usr/local/lib/node_modules/node-sass/bin/node-sass:186:40)
    at Object.<anonymous> (/usr/local/lib/node_modules/node-sass/bin/node-sass:368:15)
    at Module._compile (module.js:635:30)
    at Object.Module._extensions..js (module.js:646:10)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Function.Module.runMain (module.js:676:10)

Process finished with exit code 1

Answer 1

https://github.com/sass/node-sass#command-line-interface 的可用选项中既没有--compile也没有--map列出。

使用最新的 node-sass 版本 (4.7.2) 时，以下设置对我来说很好用：

Arguments: $FileName$ --source-map=true -o $ProjectFileDir$/css
Output Paths to refresh: $ProjectFileDir$/css/$FileNameWithoutExtension$.css:$ProjectFileDir$/css/$FileNameWithoutExtension$.css.map
Working directory: $FileDir$