it-swarm.cn

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

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

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