How to Minify CSS with SCSS File Watcher in PHPStorm IDE

懵懂的女人 提交于 2019-11-28 18:47:03

问题


Is there a way to configure SASS FileWatcher so it builds a Minified CSS?

I currently configured SASS + YUI Compressor to accomplish this but I would like to do this with pure SASS if possible.

Here are the screenshots of both configurations:

SASS

YUI Compressor CSS

Thanks in advance.


回答1:


Probably the fastest way to achieve this is to use the compressed option, mentioned in the previous comments, as an argument. The quickest way to configure this in PHPStorm is as follows:

  • Go to File > Settings
  • Inside Project Settings select File Watchers
  • You should already have an SCSS watcher created here (if you have the SCSS watch plugin enabled, PHPStorm prompts you to create a watcher when opening a new .scss file.) Otherwise, enable it (more info about that in this section of the official documentation,) and then create the new watcher pressing the "+" symbol.
  • Double click the watcher name to access its configuration.
  • In the Arguments line make sure to add the --style compressed argument
  • Click OK and you're done

This image shows how that configuration should look:

From that point on, your .css output files will be compressed.




回答2:


If you are using sassc under Linux (Arch) you could use as Arguments:

-t compressed -m auto $FileNameWithoutExtension$.scss $FileNameWithoutExtension$.min.css


来源:https://stackoverflow.com/questions/17982845/how-to-minify-css-with-scss-file-watcher-in-phpstorm-ide

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!