路由需要写在router文件夹下的index.js中
按照npm 安装之后给出是示例写法 是这样的
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld
}
]
})
但是前些天看到 同学的另一种写法 懒加载写法
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
export default new Router({
routes:[
path:'/',
name:'HelloWorld',
component:resolve=>require(['@/component/HelloWorld'],resolve)
]
})
懒加载 --->延迟加载 ,在需要的时候进行加载,随用随载
像vue种种单页面应用,如果么有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,时间过长,会长时间出现白屏,即使做了loading也是不利于用户体验,而运用懒加载则可以将页面进行划分,需要的时候加载页面,可以有效地分担首页所承担的加载压力,减少首页加载用时
简单的说 进入首页不用一次加载过多的资源造成用时过长
如果打包过程 出现报错 找到build下面的webpack.pro.conf.js 添加publicPath:'./'
补充一点 方法中路由跳转
this.$router.push({name:'home'});
this.$router.go('/login')
