前端性能优化(2.4 vue 懒加载)
1. 组件注册懒加载
(1)全局注册
Vue.component('AsyncComponent', ()=> import('./AsyncComponent.vue'))
(2)局部注册
new Vue({ components: { AsyncComponent: () => import('./AsyncComponent.vue') } })
(3)named export组件注册
new Vue({ components: { AsyncComponent: () => import('xx-ui').then(({ AsyncComponent }) => AsyncComponent) } })
2. Vue router路由注册懒加载
const Login = () => import('./Login.vue') new VueRouter({ routes: [ { path: '/login', component: Login } ] })
3. vuex 模块懒加载
const store = new Vuex.Store() import('./store/login').then(loginModule => { store.registerModule('login', loginModule) })