import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/hello/index.vue'
// import Demo from '@/components/demo/index.vue' Vue.use(Router)
//vue路由懒加载
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
// component: HelloWord,//非懒加载
// component: () => import('@/components/hello/index.vue')//ES6懒加载
component: resolve => require(['@/components/hello/index.vue'],resolve)//ES5懒加载
},
{
path: '/demo',
name: 'demo',
component: () => import('@/components/demo/index.vue')
}
]
})

vueRouter lazyLoad的更多相关文章

  1. 「Vue.js」Vue-Router + Webpack 路由懒加载实现

    一.前言 当打包构建应用时,Javascript 包会变得非常大,影响页面加载.如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了.结合 Vue ...

  2. Vue-Router 页面正在加载特效

    Vue-Router 页面正在加载特效 如果你在使用 Vue.js 和 Vue-Router 开发单页面应用.因为每个页面都是一个 Vue 组件,你需要从服务器端请求数据,然后再让 Vue 引擎来渲染 ...

  3. TypeScript为Zepto编写LazyLoad插件

    平时项目中使用的全部是jQuery框架,但是对于做webapp来说jQuery太过于庞大,当然你可以选择jQuery 2.*针对移动端的版本. 这里我采用移动端使用率比较多的zepto框架,他跟jqu ...

  4. 【腾讯Bugly干货分享】基于 Webpack & Vue & Vue-Router 的 SPA 初体验

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57d13a57132ff21c38110186 导语 最近这几年的前端圈子,由于 ...

  5. Vue.js——vue-router 60分钟快速入门

    概述 vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来.传统的 ...

  6. vue-router(2.0)

    用Vue.js+vue-router创建单页应用是比较简单的.使用Vue.js时,我们就已经把组件组合成一个应用了,当你要把vue-router加进来,只要配置组件和路由映射,然后告诉vue-rout ...

  7. 图片的赖加载(lazyLoad)

    懒加载的意义(在线demo预览) 尽管很多公司的网页都有一些限制,比如页面的最大的图片大小不得大于50k,也有很多图片优化工具fis3.gulp等等,但是如果图片太多还是会影响页面的加载速度,快则几十 ...

  8. 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)

    js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...

  9. vue-router

    官方文档: 旧版:https://github.com/vuejs/vue-router/tree/1.0/docs/zh-cn 新版:http://router.vuejs.org/(2.0版本) ...

随机推荐

  1. http协议进阶(五)连接管理

    几乎所有的HTTP通信都是由TCP/IP承载的,TCP/IP是全球计算机网络设备都在使用的一种分组交换网络分层协议集. 它的特点是只要连接建立,客户端与服务器之间的报文交换就永远不会丢失.受损或失序. ...

  2. AI pytorch

    pytorch 参考链接: https://pytorch.org

  3. 【Topcoder 8572】TheLuckySum

    题意:给一个数\(n\),要把它分成lucky numbers的和. 问个数最少.字典序最小的方案. 思路:果断搜索.个数最少,所以迭代加深.枚举要的个数\(m\). 首先我们看\(n\)的个位.它肯 ...

  4. PyInstaller安装使用方法

    PyInstaller可以把Python应用程序及其所有依赖项捆绑到一个包中.用户可以在不安装Python解释器或任何模块的情况下运行打包的应用程序.PyInstaller支持Python 2.7和P ...

  5. 算法笔记-状压dp

    状压dp 就是把状态压缩的dp 这样还是一种暴力但相对于纯暴力还是优雅的多. 实际上dp就是经过优化的暴力罢了 首先要了解位运算 给个链接吧 [https://blog.csdn.net/u01337 ...

  6. Day6 Numerical simulation of optical wave propagation之通过随机介质(如大气湍流)的传播(二)

    2.蒙特卡洛相位屏 大气折射率变化是一个随机的过程,通过大气的光程长度也同样是随机的.因此,湍流模型仅给出统计平均值,如折射率变量的结构函数和功率谱. 建立大气相位屏的问题就是产生随机过程独立表达式的 ...

  7. OpenStack-Storage(6)

    一. DAS/NAS/SAN 1.存储分类 (1)内置存储 (2)外挂存储 DAS (DirectAttached Storage):直连式存储 FAS (FabricAttached Storage ...

  8. Python——转义字符解释

    转义字符 解释 ASCII值 \a 响铃 7 \b 退格 8 \f 换页 12 \n 换行 10 \r 回车 13 \t 水平制表 9 \v 垂直制表 11 \\ 一个反斜线字符 92 \' 一个单引 ...

  9. java基础1之引用数据类型

    5种引用类型(对象类型) 类 接口 数组 枚举 标注 类 类在JVM的内存空间的存储 (1). Heap 堆空间:分配对象 new Student() 存放引用数据类型的实例 (2). Stack 栈 ...

  10. 【XSY2962】作业 数学

    题目描述 有一个递推式: \[ \begin{align} f_0&=1-\frac{1}{e}\\ f_n&=1-nf_{i-1} \end{align} \] 求 \(f_n\) ...