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. IDEA 相关整理

    插件部分 Lombok 日志不定义

  2. Ubuntu下解压压缩文件

    1.ZIP解压    ZIP因为它的跨平台使用优点,是目前使用率最高的一种压缩方式,但是它的压缩率相比较tar.gz和tar.gz2来讲,却要低很多.    压缩命令:zip -r archive_n ...

  3. Java socket详解(转)

    一:socket通信基本原理. 首先socket 通信是基于TCP/IP 网络层上的一种传送方式,我们通常把TCP和UDP称为传输层. 如上图,在七个层级关系中,我们将的socket属于传输层,其中U ...

  4. Linux 系统巡检常用命令

    Linux系统巡检常用命令   # uname -a # 查看内核/操作系统# cat /etc/centos-release # 查看centos操作系统版本# cat /proc/cpuinfo ...

  5. 记一次innobackupex备份恢复数据库过程

    简介:以前备份都是通过mysqldump备份数据库的,由于是逻辑备份,所以采用这种备份方式数据是很安全的,跨平台.版本都很容易.凡事有利必有弊,逻辑备份在你数据库比较大时,备份.恢复数据所耗费的时间也 ...

  6. qrcode & vue

    qrcode & vue $ yarn add qrcode.vue # OR $ npm i -S qrcode.vue https://www.npmjs.com/package/qrco ...

  7. CMS Collector and G1 Collector

    Understanding the CMS Collector CMS has three basic operations: CMS collects the young generation (s ...

  8. 设置QPushbutton按钮背景、鼠标滑过状态、鼠标点击后状态用法

    1.1当要设置QPushbutton按钮背景,字体颜色,鼠标滑过状态,鼠标单击后状态时,可以用QSS来设置,具体的代码如下:     QPushButton *allSelect = new QPus ...

  9. 【LOJ565】【LibreOJ Round #10】mathematican 的二进制 DP 分治FFT

    题目大意 有一个无限长的二进制串,初始时它的每一位都为 \(0\).现在有 \(m\) 个操作,其中第 \(i\) 个操作是将这个二进制串的数值加上 \(2^{a_i}\).我们称每次操作的代价是这次 ...

  10. 利用zabbix api添加、删除、禁用主机

    python环境配置yum -y install python-pip安装argparse模块pip install -i https://pypi.douban.com/simple/ argpar ...