vueRouter lazyLoad
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的更多相关文章
- 「Vue.js」Vue-Router + Webpack 路由懒加载实现
一.前言 当打包构建应用时,Javascript 包会变得非常大,影响页面加载.如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了.结合 Vue ...
- Vue-Router 页面正在加载特效
Vue-Router 页面正在加载特效 如果你在使用 Vue.js 和 Vue-Router 开发单页面应用.因为每个页面都是一个 Vue 组件,你需要从服务器端请求数据,然后再让 Vue 引擎来渲染 ...
- TypeScript为Zepto编写LazyLoad插件
平时项目中使用的全部是jQuery框架,但是对于做webapp来说jQuery太过于庞大,当然你可以选择jQuery 2.*针对移动端的版本. 这里我采用移动端使用率比较多的zepto框架,他跟jqu ...
- 【腾讯Bugly干货分享】基于 Webpack & Vue & Vue-Router 的 SPA 初体验
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57d13a57132ff21c38110186 导语 最近这几年的前端圈子,由于 ...
- Vue.js——vue-router 60分钟快速入门
概述 vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来.传统的 ...
- vue-router(2.0)
用Vue.js+vue-router创建单页应用是比较简单的.使用Vue.js时,我们就已经把组件组合成一个应用了,当你要把vue-router加进来,只要配置组件和路由映射,然后告诉vue-rout ...
- 图片的赖加载(lazyLoad)
懒加载的意义(在线demo预览) 尽管很多公司的网页都有一些限制,比如页面的最大的图片大小不得大于50k,也有很多图片优化工具fis3.gulp等等,但是如果图片太多还是会影响页面的加载速度,快则几十 ...
- 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)
js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...
- vue-router
官方文档: 旧版:https://github.com/vuejs/vue-router/tree/1.0/docs/zh-cn 新版:http://router.vuejs.org/(2.0版本) ...
随机推荐
- 19.java反射入门
一.反射机制是什么反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法:对于任意一个对象,都能够调用它的任意一个方法和属性:这种动态获取的信息以及动态调用对象的方法的功能称为jav ...
- python错误和调试
在程序运行过程中,总会遇到各种各样的错误. 有的错误是程序编写有问题造成的,比如本来应该输出整数结果输出了字符串,这种错误我们通常称之为bug,bug是必须修复的. 有的错误是用户输入造成的,比如让用 ...
- js正则表达式——数字校验
// 只能输入正数 function clearNoNum(obj) { // 只能输入数字和小数点的文本框, 只能输入小数点后两位 obj.value = obj.value.replace(/[^ ...
- H5 基于Web Storage 的客户端留言板
<!DOCTYPE html> <html> <head> <meta name="author" content="Yeeku ...
- Python @property 方法
考察 Student 类: class Student(object): def __init__(self, name, score): self.name = name self.score = ...
- 通过FactoryBean配置Bean
这是配置Bean的第三种方式,FactoryBean是Spring为我们提供的,我们先来看看源码: 第一个方法:public abstract T getObject() throws Excepti ...
- SharedPreferences类的使用
SharedPreferences,用xml文件保存用户的偏好设置,是一个轻量级的存储类. 效果图: 代码: activity_main <?xml version="1.0" ...
- linux 安装所有软件可以使用这个网站搜索RPM包
#很方便很实用 强烈推荐 https://pkgs.org/
- 用Pytorch训练线性回归模型
假定我们要拟合的线性方程是:\(y=2x+1\) \(x\):[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14] \(y\):[1, 3, 5, 7, ...
- <数据结构基础学习>(四)链表 Part 1
一.链表基础 动态数组.栈.队列底层都是依托静态数组实现的,靠resize来解决固定容量问题. 链表是真正的动态数据结构,是一种最简单的一种动态数据结构. 更深入的理解引用(或者指针). 更深入的理解 ...