vue懒加载(白屏或者加载慢的解决方法)
懒加载:也叫延迟加载,即在需要的时候进行加载,随用随载。
为什么需要懒加载?
  像vue这种单页面应用,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,时间过长,会出啊先长时间的白屏,即使做了loading也是不利于用户体验,而运用懒加载则可以将页面进行划分,需要的时候加载页面,可以有效的分担首页所承担的加载压力,减少首页加载用时
 简单的说就是:进入首页不用一次加载过多资源造成用时过长!!!
如何实现?懒加载写法:
非懒加载的路由配置:
还有一点:是我遇到的如果你遇到了就看下——就是用了懒加载后打完包直接运行那个index.html会报错,报文件引用错误其实是打包时候路径配置有点问题修改下就好了
找到build下面的webpack.prod.conf.js   添加   publicPath:"./",

vue懒加载的更多相关文章

  1. 关于Vue懒加载问题

    有关Vue懒加载其实并不是想象的那么难和复杂: 首先引入 import  VueLazyLoad from 'vue-lazyload'; 其次是使用 Vue.use(VueLazyLoad,{ er ...

  2. vue懒加载 && 浏览器高度

    当我们进入首页时,可能有很多条目需要显示,但是如果条目太多,我们全部将之显示出来就会造成性能的消耗,比如,我在第一条就找到了需要的或者我就看前面两条我就不想看后面的了,所以,这时候如果使用全部加载的方 ...

  3. vue懒加载 路由 router 的编写(resolve)

    如果用import引入的话,当项目打包时路由里的所有component都会打包在一个js中,造成进入首页时,需要加载的内容过多,时间相对比较长.当你用require这种方式引入的时候,会将你的comp ...

  4. vue-lazyload 的vue 懒加载的使用

    vue-lazyload vue 图片懒加载的使用 下载 vue-lazyload npm i vue-lazyload -S 使用 vue-lazyload 在 src 下面的 main.js 的文 ...

  5. 使用Webpack的代码分离实现Vue懒加载(译文)

    当一个Vue的项目体积变得十分庞大的时候,使用Webpack的代码分离功能将Vue Components,routes或Vuex的代码进行分离并按需加载,会极大的提高App的首屏加载速度. 在Vue的 ...

  6. 使用Webpack的代码分离实现Vue懒加载

    当一个Vue的项目体积变得十分庞大的时候,使用Webpack的代码分离功能将Vue Components,routes或Vuex的代码进行分离并按需加载,会极大的提高App的首屏加载速度. 在Vue的 ...

  7. vue懒加载实现

  8. vue 路由懒加载 使用,优化对比

    vue这种单页面应用,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,时间过长,会出啊先长时间的白屏,即使做了loading也是不利于用户体验,而运 ...

  9. Vue小技巧-懒加载

    Vue懒加载包括图片懒加载与路由懒加载 1.图片懒加载: 首先安装 vue-lazyload包 然后导入并加载事先下载好的加载图片 import VueLazyLoad from 'vue-lazyl ...

随机推荐

  1. SpringBoot2整合activiti6环境搭建

    SpringBoot2整合activiti6环境搭建 依赖 <dependencies> <dependency> <groupId>org.springframe ...

  2. Mybatis-Plus的BaseMapper的使用

    Mybatis-Plus 是一款 Mybatis 动态 SQL 自动注入 Mybatis 增删改查 CRUD 操作中间件, 减少你的开发周期优化动态维护 XML 实体字段. 下面简单举例,调用Base ...

  3. spring和struts整合

    整合准备:导入jar包 如果只是访问action,没有做数据库方面的操作的话 只需要导入下面的jar spring相关jar 以及struts相关jar包 整合过程: 用到了struts所以需要在we ...

  4. BA-协议-BACnet 协议优势简析

    BACnet - Building Automation and Control Network 的简称,为楼宇自控网络制定 的网络和通讯协议 .由美国暖通空调工程师协会主导制定的开放的楼宇自控通讯标 ...

  5. git常规使用的命令

    注: xxxx代表你的分支名称   1:本地新建一个分支,与远程分支关联: git branch --set-upstream-to origin/xxxx xxxx   2:创建本地分支: git ...

  6. POJ 2110

    终于过了,SHIT,二分+DFS即可,二分区间,根据数字是否在区间内,变成迷宫题了.枚举第一个格子,二分上界,即可. #include <iostream> #include <cs ...

  7. Ubuntu12.04 下 GTK3.xx 的安装、编译和測试

    用此方法成功在UBUNTU 12.04下安装GTK 3.xxx. 一.安装 1.安装gcc/g++/gdb/make 等基本编程工具 $sudo apt-get install build-essen ...

  8. 拷贝构造函数(深拷贝vs浅拷贝)

    拷贝构造函数(深拷贝vs浅拷贝) 类对象之间的初始化是由类的拷贝构造函数完毕的.它是一种特殊的构造函数,它的作用是用一个已知的对象来初始化还有一个对象.假设在类中没有显式地声明一个拷贝构造函数.那么, ...

  9. Methods Collection of Enumerating Com Port in Windows, by C

    According to this stack overflow thread, PJ Naughter has implemented 9 methods to emunerate com port ...

  10. 2015.05.11,外语,读书笔记-《Word Power Made Easy》 15 “如何谈论事情进展” SESSION 44

    1. not the real McCoy simulate(['simjuleit] v. 假装,冒充,模仿,模拟)来自拉丁simulo,copy的意思.simulo本身派生自拉丁形容词simili ...