是由淘宝开发的一个 模块,可以实现多个静态文件的合并,安装完成后的调用方式,如下:
http://example.com/??style1.css,style2.css,foo/style3.css
安装步骤:
1、因为nginx添加新模块需要重新编译,所以我们要先知道自己已经安装nginx版本与之前安装模块列表
# nginx -V
其中 nginx version 是版本号,configure arguments 为已经安装的模块列表
2、得到自己的nginx版本号后,我们再去nginx官网下载对应版本文件(我的nginx版本是v1.4.4)
# wget http://nginx.org/download/nginx-1.4.4.tar.gz
3、解压 nginx-1.4.4.tar.gz 并进入目录
# tar -xf nginx-1.4.4.tar.gz# cd nginx-1.4.4
4、下载 nginx-http-concat
# git clone git://github.com/alibaba/nginx-http-concat.git
5、配置模块并编译
# ./configure --user=www --group=www --prefix=/usr/local/nginx --with-http_stub_status_module --without-http-cache --with-http_ssl_module --with-http_gzip_static_module --add-module=/root/nginx-1.4.4/nginx-http-concat# make
这里记得不要用 make install,否则会直接覆盖之前的nginx
6、备份原来的 nginx,并替换最新nginx(替换之前先关闭nginx)
# cp /usr/local/nginx/sbin/nginx /usr/local/nginx/sbin/nginx.bak# cp objs/nginx /usr/local/nginx/sbin/nginx
7、配置 concat(配置成功后记得重启nginx)
location /js/ { concat on; # 允许concat最大的文件数 concat_max_files 10; # 只允许相同类型的文件 concat_unique on; # 允许内容的类型 concat_types application/x-javascript,text/css; }
8、测试是否成功
8.1、我们在js目录下分别创建1.js和2.js
//1.jsconsole.log('1.js load success!');
//2.js console.log('2.js load success!');
8.2、在页面上引入合并后的js
8.3、执行结果
9、K.O
PS:APACHE也有一个类似功能的插件 mod concatx,有兴趣的童鞋可以去了解一下。