路由懒加载
![](https://img2022.cnblogs.com/blog/2111933/202211/2111933-20221119123537789-2001143015.png)
推荐使用下面的方法
import Vue from 'vue' import VueRouter from 'vue-router' const Home = () => import('../components/Home') const About = () => import('../components/About') const User = () => import('../components/User') //1.通过Vue.use(插件),安装插件 Vue.use(VueRouter) //2.创建VueRouter对象 const routes = [ { path:'/', //重定向到home redirect: '/home' }, { path:'/home', component: Home }, { path:'/about', component: About }, { path: '/user/:userName', component: User } ] const router = new VueRouter({ mode: 'history',//使用history模式,去除url中的#符号(hash模式) //配置路由和组件之间的应用关系 routes }) //3.将router对象传入到vue实例 export default router