Question

请教怎么在webstorm里面加入scss的watch

Answer 1

webstorm安装sass插件，使webstorm自动编译sass文件，然后再

打开设置窗口- >file Watchers- >右边的绿色加号- >scss，点击ok即可完成scss文件的时时编译。
接下来配置：
时时生成css和css.map文件
在'Arguments':--no-cache --update $FileName$:$FileNameWithoutExtension$.css中添加 --sourcemap --watch
即：--no-cache --update --sourcemap --watch $FileName$:$FileNameWithoutExtension$.css
在'Output paths to refresh':$FileNameWithoutExtension$.css后面添加:$FileNameWithoutExtension$.css.map
即：$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map
单击ok，此时时时编译后会产生.css文件和.css.map两个文件，默认是生成.css一个文件。
最后配置：
修改生成文件位置
在 'Arguments'中的 $FileName$:后面和$FileNameWithoutExtension$.css前面添加配置路径
例--no-cache --update --sourcemap --watch $FileName$:$FileParentDir$css$FileNameWithoutExtension$.css
这是在scss文件所在目录的父级目录下的css文件夹放置生成文件，其中的$FileParentDir$代表当前文件夹得父级文件夹。