基础配置
import index from '../view/index.vue'
const routes = {
{
path:'/index',
component:index
}
}
懒加载
好处:
如果用import引入的话,当项目打包时路由里的所有component都会打包在一个js中,造成进入首页时,需要加载的内容过多,时间相对比较长。
当你用require这种方式引入的时候,会将你的component分别打包成不同的js,加载的时候也是按需加载,只用访问这个路由网址时才会加载这个js。
import index from '../view/index.vue'
const routes = {
{
path:'/index',
component: resolve => require([('@/views/index')], resolve),
component: () =>
import ('@/views/index')
//两种写法,推荐第二种
}
}