如何压缩我的 JavaScript 和 CSS 文件？

Posted 2023-02-24

【中文标题】如何压缩我的 JavaScript 和 CSS 文件？

【英文标题】：How can I gzip my JavaScript and CSS files?

【发布时间】：2011-02-09 14:27:00

【问题描述】：

我有一个问题，我必须 gzip 一个原型库，但我完全不知道如何做到这一点，从哪里开始以及它是如何工作的。 :)

我找到了一些教程，但没有帮助...

所以我有一个包含我的 JS 文件的文件夹：

/压缩/js/ 1.js 2.js 3.js

我正在调用这些文件以在此文件中进行测试

/compresses/index.php

<link rel="javascript" type="text/js" href="js/tabs.js" />
<link rel="javascript" type="text/js" href="js/fb.js" />

那我该怎么办？ :)

【问题讨论】：

注意，没有 <link rel="javascript"> 这样的东西（很遗憾），也没有像 text/js 这样的 MIME 类型。

【参考方案1】：

您好，如果您使用的是 Nginx 服务器，上述内容将无济于事。请使用命令vi /etc/nginx/nginx.conf 编辑并添加以下行。

gzip on;
gzip_http_version 1.1;
gzip_comp_level 2;
gzip_types    text/plain text/html text/css
          application/x-javascript text/xml
          application/xml application/xml+rss
          text/javascript;

使用命令 /etc/init.d/nginx reload 重启 nginx。它将压缩 JS 和 CSS 文件。

【讨论】：

经过多次尝试后，这对我有用......非常感谢。我还添加了一些类型，因为我的 js 需要 application/javascript：gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript application/vnd。 ms-fontobject 应用程序/x-font 应用程序/x-font-opentype 应用程序/x-font-otf 应用程序/x-font-truetype 应用程序/x-font-ttf 应用程序/xhtml+xml 字体/opentype 字体/otf 字体/ttf图片/svg+xml 图片/x-icon;

【参考方案2】：

将此代码添加到您的 .htaccess 中，它将 gzip 您所有的 css 和 js 文件。

# BEGIN GZIP
<ifmodule mod_deflate.c>
AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
</ifmodule>
# END GZIP

【讨论】：

对不起，如果这是一个愚蠢的问题，但这就是我所要做的吗？我不需要手动压缩文件吗？只需将其粘贴在 .htaccess 中即可？

是的，这就是你所要做的！

【参考方案3】：

我上面与此类似的示例效果很好，但没有压缩 javascript。我需要添加应用程序/javascript。

AddOutputFilterByType DEFLATE text/html text/xml text/css text/javascript application/javascript 

【参考方案4】：

您可以使用 apache 的 mod_deflate 动态自动压缩文件。

例子：

AddOutputFilterByType DEFLATE text/html text/xml text/css text/javascript 

[编辑]

要检查您的 apache 服务器是否已启用输出压缩，请将上面的示例放入 .htaccess 文件中。然后通过服务器加载一个 html 或 js 文件并检查“Content-Encoding”的标题，如果它显示 gzip 或 deflate，则它已启用。

【讨论】：

在我的 htaccess 中？我需要准备我的 js 和 css 文件吗？压缩它们或像这样认为

您需要访问您的虚拟主机/服务器配置才能全局启用压缩。您无需准备文件，它们会根据要求自动压缩。

哦，如果启用了输出压缩，您可以在 .htaccess 中使用上面的示例。

@elias : Nginx 呢？

非常有帮助。很高兴看到我的个人网站主机默认启用了此功能。我需要看看 IIS 是否在幕后工作，我还想知道为什么某些 IDE 可以为您 GZIP 文件，以及将 GZIPed 文件上传到您的 FTP 有什么好处。在我对 IIS 的快速测试中（不能保证 Apache），你不能在 <script> 标签的一部分中使用 .js.gzip 并让它工作。我很好奇内部是如何工作的。

【参考方案5】：

您需要使用您正在使用的 HTTP 服务器的配置来处理这些内容。

您能告诉我您使用的是哪个服务器吗？ IIS/Apache ?

Following is link 用于使用 IIS 进行压缩

【参考方案6】：

也许你应该看看 Apache 的 mod_deflate 模块：http://httpd.apache.org/docs/2.0/mod/mod_deflate.html

【讨论】：

我需要以某种方式准备我的文件吗？

不，尽管缩小它们并不是一个坏主意；）