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关闭的样式）

如果我没弄错的话，Yahoo YUI压缩器/ Rhino会这样做：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-x.y.z.jar foo.js | foo.min.js

但是，您可以在部署时以编程方式执行此操作。如果您正在使用图书馆像Sprockets或Less，他们会为你做这件事。否则，有几个接口图书馆到YUI压缩器，如Sam Stephenson的Ruby-YUI压缩器宝石或 Jammit图书馆。

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

3 个答案: