1.去掉多余的库
  将不必要的库卸载掉 npm uninstall xxx
  举个例子:例如moment库文件是很大的,在前端可以用js的 new Date实现获取日期,或者可以其他库代替,也可以将moment库放在服务端用,将所有关于时间的处理放到服务端进行。 
2.路由懒加载
  将下图中的1改为2,详细可以百度搜索 vue路由懒加载
3.开启服务端gzip压缩
  我这里用的是nginx,所以下找到nginx配置文件:
  vi /etc/nginx/nginx.conf
  跟着下图一样开放nginx的gzip配置:

4.将文件放到cdn上
  在项目根目录index.html使用cdn节点导入

  

  

 

解决vue生产环境app.js或vendor文件过大问题的更多相关文章

  1. vue+webpack+element-ui项目打包优化速度与app.js、vendor.js打包后文件过大

    从开通博客到现在也没写什么东西,最近几天一直在研究vue+webpack+element-ui项目打包速度优化,想把这几天的成果记录下来,可能对前端牛人来说我这技术比较菜,但还是希望给有需要的朋友提供 ...

  2. Vue生产环境调试的方法

    vue 生产环境默认是无法启用vue devtools的,如果生产应用出了问题,就很难解决.. 原理 先说下vue如何判断devtools是否可用的. vue devtools扩展组件会在window ...

  3. Vue生产环境部署

    前面的话 开发时,Vue 会提供很多警告来帮助解决常见的错误与陷阱.生产时,这些警告语句却没有用,反而会增加载荷量.再次,有些警告检查有小的运行时开销,生产环境模式下是可以避免的.本文将详细介绍Vue ...

  4. Vue 生产环境部署

    简要:继上次搭建vue环境后,开始着手vue的学习;为此向大家分享从开发环境部署到生产环境(线上)中遇到的问题和解决办法,希望能够跟各位VUE大神学习探索,如果有不对或者好的建议告知下:*~*! 一. ...

  5. Vue 生产环境(production) 打开 调试工具的方法

    总所周知,在production生产环境下,点击vue插件会显示, 并且按F12是没办法使用调试工具的,这样非常不方便 其实是有一个办法的,那就是复制下面的js,然后在控制台执行 代码中已经写清楚执行 ...

  6. vue生产环境清除console.log

    npm run build 后的生产环境的代码,会有很多开发时留下的console.log(),不可能每个页面不停地删除 在build/webpack.prod.conf.js文件里加上这样一段代码即 ...

  7. VUE生产环境打包build

    1.进入到项目根目录执行 npm run build 此时会自动打包在dist目录下 2.安装服务 npm  install -g serve 3.启动 serve dist 总结: 以上就是生产环境 ...

  8. vue 生产环境 background 背景图不显示原因

    通常我们使用img标签引入文件,npm run build 打包后 ,因为img为html标签,打包后他的路径是由index.html开始访问的,他走static/img/'图片名'是能正确访问到图片 ...

  9. vue生产环境部署总结

    参考:http://www.cnblogs.com/vipstone/p/6910255.html 1. vue项目根目录/config/index.js更改资源生成路径 assetsPublicPa ...

随机推荐

  1. abuse

    abuse 近/反义词: ill-treat, maltreat, mistreat, misuse, prostitute, spoil; defame, disparage, malign, re ...

  2. Spark产生数据倾斜的原因以及解决办法

    Spark数据倾斜 产生原因 首先RDD的逻辑其实时表示一个对象集合.在物理执行期间,RDD会被分为一系列的分区,每个分区都是整个数据集的子集.当spark调度并运行任务的时候,Spark会为每一个分 ...

  3. JAXB—Java类与XML文件之间转换

    JAXB-Java类与XML文件之间转换 简介         JAXB(Java Architecture for XML Binding) 是一个业界的标准,是一项可以根据XML Schema产生 ...

  4. swagger文档

    关键配置文件 spring boot demo pom.xml <?xml version="1.0" encoding="UTF-8"?> < ...

  5. 实现new Date(), 获取当前时间戳

    JS 获取时间戳: 我相信大家找了很久了吧! 希望我写的这个对您有些帮助哦~ 大家是不是以为时间戳是关于时间的,都去 new Date() 里面找方法了啊,我来告诉你们正确的吧 其实大家用 JS 里的 ...

  6. 【Java 8】Stream.distinct() 列表去重示例

    在这篇文章里,我们将提供Java8 Stream distinct()示例. distinct()返回由该流的不同元素组成的流.distinct()是Stream接口的方法. distinct()使用 ...

  7. Spring实现类私有方法测试通用方案

    现实的业务场景中,可能需要对Spring的实现类的私有方法进行测试. 场景描述: 比如XXXService里有 两个函数a.函数b. 而实现类XXXServiceImpl中实现了函数a.函数b,还包含 ...

  8. lucene索引的增、删、改

    package com.hope.lucene;import org.apache.lucene.document.Document;import org.apache.lucene.document ...

  9. JuiceFS 缓存策略详解

    对于一个由对象存储和数据库组合驱动的文件系统,缓存是本地客户端与远端服务之间高效交互的重要纽带.读写的数据可以提前或者异步载入缓存,再由客户端在后台与远端服务交互执行异步上传或预取数据.相比直接与远端 ...

  10. LuoguP1619 解一元二次方程的烦恼 题解

    Content 模拟一个系统,给出一个数 \(n\),让你判断是否是素数,如果是合数的话就要质因数分解. 需要注意的几点: 数字超过 \(4\times 10^7\),输出溢出提示. 数字小于 \(2 ...