vue 组件懒加载(按需加载)的具体实现

目的

只在访问当前页面时加载对应组件，避免页面组件全部加载。（按需加载）
ES6

// 组件名字与按需引入方式
const Home = () => import(/* webpackChunkName: "home" */ '@/components/page/home/home-index').then(m => m.default)
const Login = () => import(/* webpackChunkName: "login" */ '@/components/page/login/login').then(m => m.default)

Require

const Routers = [
  {
    path: '/',  // 路径
    component: resolve => require(['../components/member/index], resolve)  // 异步加载组件
  },
  {
    path: '/login',
    component: resolve => require(['../components/member/login'], resolve)
  }
]

脚本之家-Vue按需加载的具体实现