1、组件通过箭头函数import组件 component: () => import(/* webpackChunkName: 'ImportFuncDemo' */ '@/views/about') 注意: 在vuecli3中我发现,通过懒加载的页面在首页访问时还是会加载 由源码中发现,懒加载的about文件引入加上了 rel = prefetch <link rel="prefetch">会在页面加载完成后,利用空闲时间提前加载获取用户未来可能会访问的内容。 //手动选定要提前获取的代码 import(webpackPrefetch: true, './someAsyncComponent.vue') 不需要该模式时可以 取消 prefetch 在 vue.config.js 中修改 module.exports = { chainWebpack: config => { // 移除 prefetch 插件 config.plugins.delete('prefetch') } } 2、vue异步组件技术 ==== 异步加载 component: resolve => require(['@/views/me'],resolve) 3、webpack提供的require.ensure() chunkName :文件名 component: () => require.ensure([], () => r(require('@/views/other')), 'chunkName')