库版本"@babel/plugin-syntax-dynamic-import":"^7.8.3","@babel/polyfill":"^7.6.0","@babel/core":"^7.6.0","@babel/preset-env":"^7.6.0","babel-plugin-dynamic-import-webpack":"^1.1.0","vue":"^2.6.10","vue-router":"^3.1.3","webpack":"^4.28.3",涉及router文件中的转换文件vue-routerrouter/index.js,需要将正常的import引用改为import()引用,具体的import()知识点这里不再赘述,只需要知道这是一个异步引用即可。更改原始importCompfrom'../componnets/Comp'的构建参考;constComp=()=>import(/*webpackChunkName:"Comp"*/'../componnets/Comp');注意注意Inside/*webpackChunkName:"CourseIntro"*/不要省略路由器配置中原来的配置constrouter=newRouter({routes:[{path:'/pathname',component:Comp,}]})webpackwebpack无需额外配置babel如果使用babel加载,需要引用额外的库“babel-plugin-dynamic-import-webpack”执行yarnaddbabel-plugin-dynamic-import-webpack--save-dev和babel.config中。在js中配置module.exports={presets:[['@babel/preset-env',{useBuiltIns:'usage',corejs:'2.6',modules:'false',//注意这必须是false,否则plugin-syntax-dynamic-import将不起作用},],],plugins:['@babel/plugin-syntax-dynamic-import'],};注意事项如果要兼容非promise环境(如IE),需要自己引用polyfill。具体方法参考文档。packageexportdefault()=>Promise.resolve({/*vue组件信息*/})但是在实际使用中发现这样做会报错,原因不明
