wake-up-neo.net

我应该使用什么来自动组合css / js文件？

我知道 链轮 用于组合javascript文件，但还没有尝试过。还有什么其他选择以及它们如何叠加？

optimizationjavascriptcss
14
Cebjyre

我为Asp.Net编写了一个处理程序，它使用YUI来压缩，连接和缓存输出。

这是来源： http://Gist.github.com/13091

4
travis

我已经在 另一个问题中解决了这个问题

事后看来，我应该在网站管理员而不是程序员网站上提出这个问题。

你有3个选择:

  1. 让您的框架自动处理它
  2. 让您的网络服务器自动处理它
  3. 滚动您自己的选项以手动执行此操作

选项1（使用CakePHP扩展名）:

下载并安装 AssetPacker 到您的站点（这也需要jsmin和CSSTidy）。修改包含js文件的几行源代码。耐洗> Rinse->重复。瞧，其余的都是自动完成的。

如果你使用其他框架，很可能，有一个工具可以为你完成这个。这是webdev世界中非常普遍的要求。

选项2（使用Apache mod）:

看看 Google Pagespeed mod for Apache 。它可以完成您描述的所有内容以及更多内容。

请务必监视生产服务器的资源。有些人一直在看到这会增加服务器负载的问题。我不是积极的，但它可能需要一个足够的静态内容策略才能成为一个有效的选择。

选项3 :

如果你真的想要，你可以创建一些连接JS文件服务器端的PHP magic，并将所有链接rel组合成一个但是......这正是两个策略已经在做的事情。

就个人而言，我强烈建议不要这样做。

据我所知，Sprockets将JS文件与AssetPacker连接起来，它只是作为Ruby Gem实现的。它不做的是缩小js代码。所以，如果你使用它，抓住jsmin gem也可能是一个好主意。 有关如何在CakePHP中使用Sprockets + JSMin的信息，请查看 。

我知道我强调CakePHP但是...我假设，如果一个插件可以适应CakePHP，那么将它调整到不同的框架应该是微不足道的。

2
Evan Plaice

如果您的webapp在PHP中，您应该考虑使用 minify ：

它结合了多个CSS或Javascript文件，删除了不必要的空格和注释，并使用gzip编码和最佳客户端缓存头提供它们。

1
Tom

一个快速谷歌搜索发现这组合CSS文件： http://www.tothepc.com/archives/combine-merge-multiple-css-files/

1
Macha

你确定要把它们组合起来吗？如果您使用公共库，则可以利用CDN来提供javascripts。然后，您可以利用浏览器缓存（假设其他站点使用相同的CDN）和分布式传递。 微软 和 谷歌 每个都有解决方案（我没有诚实地使用过，但我肯定会开始）并且可能还有其他解决方案。

1
Larry Smithmier

对于ASP.NET项目，我已将其作为基于 Karl Seguin的说明 的构建过程的一部分。

Karl在他的博客上描述得最好，但简短的版本是设置一个包装YUICompressor的控制台应用程序。然后，您可以设置一个构建后任务，以针对站点中JS文件的位置调用该控制台应用程序。

1
Raleigh Buckner

为此知道Python实际上可能有用。你很快就可以学习Python。我大约2周前开始，我的第一个应用程序（仍未完成）将完全按照你想要的方式进行。与DotLess编译器一样，它将具有一个监视文件或目录的监视功能，如果它们发生更改，它将生成一个新文件。

Python也非常适合其他维护任务，我读过许多系统管理员喜欢使用它。

1
Pickels

我创建了 Minifpy ：在Python3（Mac OS，Windows和Linux兼容）中编写的工具，使用Python合并和缩小JS和CSS文件。

Minifpy使用非常简单的JSON配置文件来定义哪些文件必须合并，缩小或不缩小：

{
    "js": {
        "minify_files": [
            {"from": "static/file.js", "to":"static/file.min.js"},
        ],
        "merge_files": [
            {"from" : ["static/file1.js", "static/file2.js"], "to":"static/public.js", "to_min": "static/public.min.js"}
        ]
    },
    "css" : {
        "minify_files": [
            {"from": "static/file.css", "to":"static/file.min.css"},
        ],
        "merge_files": [
            {"from" : ["static/file1.css", "static/file2.css"], "to":"static/public.css", "to_min": "static/public.min.css"}
        ]
    }
}

您也可以在CLI中使用此工具。

Minifpy检测JS/CSS文件的任何修改并自动合并/缩小它们（对开发很有用）。

0
Samuel Dauzon