vue路由懒加载

1. 不使用路由懒加载时：

当打包构建应用时，js包会变得非常大，影响页面加载

2. 使用路由懒加载时：

路由懒加载会将路由对应的组件打包成为一个个的js代码块

只有在这个路由被访问时，才加载对应的组件

{
  path: '/keyword-protect',
  name: 'keyword-protect',
  component: () => import('./views/operator/keyword')
},   
 
// 或

const Home = () => import('./views/home')

{
  path: '/',
  name: 'home',
  component: Home
},

 没有指定webpackChunkName，每个组件打包成一个js文件

const Home = () => import('@/components/home')

const Index = () => import('@/components/index')

指定了相同的webpackChunkName，会合并打包成一个js文件

const Home = () => import(/* webpackChunkName: 'ImportFuncDemo' */ '@/components/home')

const Index = () => import(/* webpackChunkName: 'ImportFuncDemo' */ '@/components/index')