ES Module 语法 import()

项目中webpack会自动识别出import这种语法，从而进行代码分割。

import之后会返回一个promise对象。

魔法注释webpackChunkName、webpackPrefetch、webpackPreload

 const async_test_code = ()=>import('../test.js')
 // 基本写法，异步引入模块。

 const test1 = ()=>import(/* webpackChunkName:"my-chunk-name" */ '../test1.js')
 //会将代码进行分割打包，并命名为"my-chunk-name.js"文件, 打包后的存放位置：dist/js/my-chunk-name.js
 const test1 = ()=>import(/* webpackChunkName:"aaa/my-chunk-name" */ '../test1.js')
 //会将代码进行分割打包，并命名为"my-chunk-name.js"文件, 打包后的存放位置：dist/js/aaa/my-chunk-name.js
 const test1 = ()=>import(/* webpackChunkName:"../my-chunk-name" */ '../test1.js')
 //会将代码进行分割打包，并命名为"my-chunk-name.js"文件, 打包后的存放位置：dist/my-chunk-name.js

 const test2 = ()=>import(/* webpackPrefetch:true */ '../test2.js')
 // 来告诉浏览器主线程网络带宽空闲时候，进行加载该模块，当真正运行该模块代码时，浏览器已经加载过一次，此时运行速度就会大大提升

 const test3 = ()=>import(/* webpackPreload:true */ '../test3.js')
 // 来告诉浏览器主线程跟主线程一起加载，这种方式不太推荐。

import(/*webpackChunkName:"test_module"*/'./test.js').then((module) => {
    console.log(module);
});