在站点配置添加如下代码:

    location ~* \.(css|js)$ {
gzip_static on;
}

这是 nginx 的静态 gzip功能,会自动查找对应扩展名的文件,如果存在 gzip 文件,就使用,如果没有就用原文件

配合 vue-cli 的构建工具,开启 config/index.js 中的

productionGzip: true

Vue默认没有安装相应webpack 插件,需要手动安装一下:

npm install --save-dev compression-webpack-plugin

build 时会看到多打出很多 .gz 的包就ok啦~

refer: 论坛文章

nginx 开启静态 gzip 配合 Vue 构建的更多相关文章

  1. Nginx开启Gzip详解

    最近生产上发生了一些问题,原先所有的静态资源文件都是经过gzip压缩的,然而这几天突然都没有压缩了,经过一顿排查,发现是Nginx的配置有问题,借此机会详细了解了Nginx的Gzip配置. 1. Ng ...

  2. nginx 开启gzip压缩

    Nginx开启Gzip压缩功能, 可以使网站的css.js .xml.html 文件在传输时进行压缩,提高访问速度,!  Web网站上的图片,视频等其它多媒体文件以及大文件,因为压缩效果不好,所以对于 ...

  3. Nginx开启gzip压缩功能

    在Nginx安装完成之后,我们可以开启Gzip压缩功能,这里Nginx默认只能对text/html类型的文件进行压缩.下面的指令为开启Gzip的指令: gzip on; gzip_http_versi ...

  4. Nginx 开启gzip压缩(图片,文件,css)

    1.Vim打开Nginx配置文件 vim /usr/local/nginx/conf/nginx.conf 2.找到如下一段,进行修改 gzip on; gzip_min_length 1k; gzi ...

  5. nginx 开启GZIP、域名指向index.html

    nginx 虽然默认开启了gzip压缩,但是有关压缩文件.压缩效率没有开启,在建设我的(个人博客)[www.fayinme.cn]中,直观的感受到gzip带来的访问速度提升的快感. 如何开启GZIP ...

  6. nginx开启gzip压缩后导致apk包下载不能正常安装

    最后更新时间:2019/4/27 nginx一般都会开启gzip压缩,以提升传输性能. 配置如下: gzip on; gzip_comp_level 2; gzip_min_length 1k; gz ...

  7. Nginx开启Gzip压缩提升页面加载速度

    1.在 nginx 的conf 目录下新建 gzip.conf 文件 #开启gzip压缩 gzip on; #设置允许压缩的页面最小字节数 gzip_min_length 1k; #申请4个单位为16 ...

  8. nginx开启gzip的方法

    nginx开启gzip的方法 1.vi打开Nginx配置文件 <pre>vi /usr/local/nginx/conf/nginx.conf</pre> 2.找到如下一段,进 ...

  9. 使用 Nginx 搭建静态资源 web 服务器

    在搭建网站的时候,往往会加载很多的图片,如果都从 Tomcat 服务器来获取静态资源,这样会增加服务器的负载,使得服务器运行 速度非常慢,这时可以使用 Nginx 服务器来加载这些静态资源,这样就可以 ...

随机推荐

  1. MySQL双主+keeplived安装部署说明

    MySQL双主+keeplived安装部署说明 一.环境介绍 1.1.规划 序号 类别 版本 主机名 IP 端口 备注 1 OS CentOS release 6.9 (Final) (minimal ...

  2. Tensorflow object detection API 搭建物体识别模型(三)

    三.模型训练 1)错误一: 在桌面的目标检测文件夹中打开cmd,即在路径中输入cmd后按Enter键运行.在cmd中运行命令: python /your_path/models-master/rese ...

  3. Hbase学习01

    1.1  快速介绍 1.1.1 快速入门,单节点Hbase 本小节介绍单节点独立HBase的设置. 独立实例包含所有HBase守护进程 - Master,RegionServers和ZooKeeper ...

  4. java io系列04之 管道(PipedOutputStream和PipedInputStream)的简介,源码分析和示例

    本章,我们对java 管道进行学习. 转载请注明出处:http://www.cnblogs.com/skywang12345/p/io_04.html java 管道介绍 在java中,PipedOu ...

  5. python socket原理 及socket如何使(tcp udp协议)

    网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为一个socket. 建立网络通信连接至少要一对端口号(socket).socket本质是编程接口(API) 主要内容: 1.基于 ...

  6. python 包和模块间的引入

    ##############################总结####################### 主要内容: 1. 模块 2. import 3. from xxx import xxx ...

  7. Linux记录-使用python临时搭建web服务器

    python2: python -m SimpleHTTPServer 8888 python3: python -m http.server 8888 wget   ip:8888/文件

  8. C#设计模式(9)——代理模式

    1.代理模式介绍 在软件开发中有时会遇到不能直接使用对象的问题,如我们要使用的对象在进程外,甚至在远程的机器上,但是我们要使用这个对象的功能怎么办呢?代理模式就可以用来解决这个问题.举一个生活中的例子 ...

  9. 在.NET程序中实现HttpServer功能

    亲爱的下午茶   博客园 首页 新随笔 联系 订阅 管理 随笔-6  文章-0  评论-10  在.NET程序中实现HttpServer功能   最近在实现一个可视化数据解析工具,需要在Wpf程序中实 ...

  10. Ubuntu Server 16.04 安装MySQL并设置远程访问

    Ubuntu Server 16.04 安装MySQL 1. 使用root账号 sudo apt-get install mysql-serversudo apt-get install mysql- ...