看到productionGzip:false,
productionGzipExtensions: ['js','css'],
有想过，webpack 中productionGzip 的意义？
压缩并相应后，在服务端有一个备份，下次有请求时，直接返回备份的gzip内容.
图一，没有开Nginx的gzip
图二，是开启Nginx的gzip 配置
图三，是webpack预先打包gzip，nginx的配置使用；
gz的意义
Nginx的gzip
location ~* /static/js/ {
gzip_static on;
expires 30d;
add_header Cache-Control public;
}
location ~* /static/css/ {
gzip_static on;
expires 30d;
add_header Cache-Control public;
}
http_gzip_static_module 模块
在nginx中使用gzip_static来缓存gzip文件
安装了nginx的Gzip静态模块（使用--with-http_gzip_static_module编译nginx）。它允许您预先缓存您的gzip文件。可以通过nginx -V检查编译时带了哪些模块。
假设你有文件/css/a.css。当遇到a.css的请求时。静态gzip模块将查找/css/a.css.gz。如果找到它，它将作为gzip压缩内容提供该文件。这允许您在部署站点时使用最高压缩比（gzip -9）对静态文件进行gzip。Nginx除了提供静态gzip文件之外绝对没有工作要做（它非常擅长提供静态内容）。
无论你在nginx配置中有gzip部分，你都可以：
gzip_static on
注意，必须自己创建文件的.gz版本，并且在文档中提到，如果原始文件和.gz文件具有相同的时间戳，则更好。因此，在创建文件后“touch”文件可能是个好主意。将gzip压缩降低（gzip_comp_level 1..3）也是一个好主意。这将最小化压缩动态内容，而不会给服务器带来太大压力。请记住，这仅适用于静态内容（css，javascript等）。动态页面可以并且应该被压缩，但压缩率较低，以保持服务器的负载能力。
Webpack可以把内容直接输出成.gz格式，这样与 Webpack 合作将是一个不错的选择。
网友评论