合并并缩小多个CSS / JS文件

我正在尝试通过合并和压缩CSS和JS文件来优化网站性能。考虑到我所面临的实际情况,我的问题更多地是关于如何实现这一(具体)步骤的(尽管在其他开发人员中也应该是典型的)。


我的页面引用了多个CSS和JS文件,如下所示:


<!--

  It's easier to work on smaller files during development.

  Hence, the multiple CSS and JS files.

-->

<link type="text/css" rel="stylesheet" href="/css/main.css" />

<link type="text/css" rel="stylesheet" href="/css/secondary-1.css" />

<link type="text/css" rel="stylesheet" href="/css/secondary-2.css" />


<script type="text/javascript" src="/scripts/js/main.js"></script>

<script type="text/javascript" src="/scripts/js/adapter/adapter.js"></script>

<script type="text/javascript" src="/scripts/js/adapter/title-adapter.js"></script>

对于生产版本,我想将3个CSS文件合并为一个,并使用例如YUI Compressor将其最小化。但是,然后,我需要更新所有需要这3个文件的页面,以引用新近缩小的CSS。这似乎容易出错(例如,您要在许多文件中删除并添加一些行)。还有其他风险较低的方法吗?JS文件也有同样的问题。


千万里不及你
浏览 589回答 3
3回答

qq_笑_17

检出minify-它允许您将多个js,css文件组合到一个URL中,例如,将它们组合为一个<script src="/scripts/js/main.js,/scripts/js/adapter/adapter.js"></script>我们已经使用了多年,它的工作非常出色,并且可以即时运行(无需编辑文件)。

哔哔one

我需要更新所有需要这3个文件的页面,以引用新近缩小的CSS。首先,我想说你应该有共同的头。因此,不需要在任何时候都更改所有标头。最好使用单个标头或2-3个标头。因此,根据您的页面需要,您可以更改标题。因此,每当您要扩展您的Web应用程序时,风险和繁琐程度都会降低。您没有提到您的开发环境。您可以看到针对不同环境列出了许多压缩工具。而且您正在使用好的工具,即YUUI Compressor。
打开App,查看更多内容
随时随地看视频慕课网APP