将开发CSS中的导入组合到1个文件中进行生产

Question

有什么我可以使用，将快速合并多个CSS导入到一个CSS文件。

例如，假设我有一个主要的styles.css文件，在开发过程中有大量的导入：

@import url('normalize.css');
@import url('1.css');
@import url('2.css');
...
@import url('10.css');

为了我自己的理智，我在开发过程中将它们分开。

我想在生产过程中尽量减少HTTP请求到1个样式文件，而不是11,12等。

那么，除了手动复制/粘贴到一个文件之外，还有什么可以将这些导入放入1个文件中吗？

LESS或SASS会做这样的事吗？

Answer 1

css-compressor，它基于yuicompressor就是这样：

https://github.com/samilyak/css-compressor

Answer 2

LESS和SASS做到这一点以及更多。 有很多服务器端的方法可以将你的css文件整理成一个文件（Less也可以用js做到这一点，但我不推荐这个，因为你会失去js off的样式）

雅虎YUI压缩器/犀牛做同样的事情如果我没有弄错： http ： //developer.yahoo.com/yui/compressor/#work

如果您检查全局选项，这个适用于您：

-o outfile

  Place output in file outfile. If not specified, the YUI Compressor will
  default to the standard output, which you can redirect to a file.
  Supports a filter syntax for expressing the output pattern when there are
  multiple input files.  ex:
      java -jar yuicompressor.jar -o '.css$:-min.css' *.css
  ... will minify all .css files and save them as -min.css

Answer 3

使用YUI Compressor的最简单方法是下载需要Java的二进制文件，并在命令行上执行它们：

java -jar yuicompressor-xyzjar foo.js | foo.min.js

但是，您可以在部署时以编程方式执行此操作。 如果您使用的是Sprockets或Less等库，他们会为您执行此操作。 否则，YUI Compressor有几个接口库，例如Sam Stephenson的Ruby-YUI压缩器gem或Jammit库。