PhpStorm - 使用文件观察器在缩小之前合并CSS文件

时间:2016-06-30 11:54:20

标签: phpstorm bundling-and-minification

我有一个项目,在不同的文件夹中有一些CSS文件,我想将它们自动组合成一个最终/实时文件。

在开发过程中,我希望它们是分开的。 我不想在css文件中使用var featureCollection; var oneFeature; var site; function runCode() { var clientContext = new SP.ClientContext(); site = clientContext.get_web(); clientContext.load(site); featureCollection = site.get_features(); clientContext.load(featureCollection); clientContext.executeQueryAsync(Function.createDelegate(this, onQuerySucceeded), Function.createDelegate(this, onQueryFailed)); } function onQuerySucceeded() { var listEnumerator = featureCollection.getEnumerator(); var featureInfo = [];

PhpStorm中的文件观察者听起来像他们应该能够做到的那样。因为我需要一些GUI。

我不习惯使用命令行。但我使用此step-by-step-guide启动并运行YUI Compressor。此设置压缩我的所有CSS文件。不是真的只需要压缩一个文件。 我还了解到YUI Compressor无法合并文件。

我想在文件更改时使用以下工作流程:

  • 以正确的顺序将CSS文件合并到一个文件中
  • 缩小一个CSS文件并保护它

有人可以列出:

  • 要安装的节点模块及其命令
  • 如何配置文件列表和订单。任何命令?文件编辑?
  • 完成合并后如何开始缩小

PS:如果有任何带有GUI的应用程序可以在PhpStorm之外的文件更改上执行此操作,那么它也是一个选项。 (CodePen不支持CSS,只支持SCSS和LESS)

1 个答案:

答案 0 :(得分:1)

我可以建议使用Grunt grunt-contrib-cssmin任务 - 它支持合并和缩小文件。您可以使用Grunt控制台运行任务(推荐),或将其配置为文件观察程序