1、安装（如果使用的是 babel，需要安装syntax-dynamic-import插件，才能使 babel 可以正确地解析语法）

$ npm install --save-dev @babel/plugin-syntax-dynamic-import

2、在babel.config.js

module.exports = {
  presets: [
    // '@vue/cli-plugin-babel/preset'
    '@vue/app'
  ],
  "plugins": [
    [
    	// 路由懒加载插件
      '@babel/plugin-syntax-dynamic-import'
    ]
  ]
}

3、在router中的index.js

export default new Router({
	routes: [
		{path: '/indexHead', name: 'IndexHead',  component:()=>import(/*webpackChunkName:"name"*/"../components/indexHead.vue")},
	]
)}

备注：/webpackChunkName:“name”/ 打包名 可以自定义，build后在dist文件中的js文件，如图：

注：在router中不需要写import IndexHead from '…/components/indexHead.vue

// import IndexHead from '../components/indexHead.vue'

4、测试中。。。

5、如果不生效，尝试如下方法：

https://blog.csdn.net/sinat_35538827/article/details/87969834?utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2_{aggregatepage}first_rank_v2~rank_v29-1-87969834.nonecase&utm_term=cli3%20vue%20%E8%B7%AF%E7%94%B1%E6%87%92%E5%8A%A0%E8%BD%BD&spm=1000.2123.3001.4430
（未体验，但是信任大佬）

周六加班的打工人，枯了