一、方法总览
image.png
二、具体实现
1.安装开发依赖
npm install --save-dev @babel/plugin-syntax-dynamic-import
2.在babel.config.js中配置申明此插件
image.png
'@babel/plugin-syntax-dynamic-import'
3.在router.js中改造路由
1.删除传统的引入
image.png
2.分组打包
image.png
component: () => import(/* webpackChunkName: "group-4" */ "../views/Goods/cate.vue")
component: () => import(/* webpackChunkName: "group-4" */ "../views/Goods/params.vue")