探究 webpack 如何实现模块异步加载

探究 webpack 如何实现模块异步加载

之前一篇文章讲了 webpack 如何实现模块的同步加载，在此基础上，今天接着讲如何实现异步加载模块。

一、源码

还是用原来的例子，但是主文件中改成按需加载（异步加载）

原来：import func from './func.js'
现在：const func = () => import('./func.js')

打包后源码（main.js 文件）：

(function (modules) {
   
	function webpackJsonpCallback(data) {
   }

	var installedModules = {
   };
	var installedChunks = {
   
		"main": 0
	};

	function __webpack_require__(moduleId) {
   }

	__webpack_require__.e = function requireEnsure(chunkId) {
   }

	return __webpack_require__(__webpack_require__.s = "./src/index.js");
})
({
   		//主文件
 "./src/index.js":
	(function (module, __webpack_exports__, __webpack_require__) {
   
		const func = () => __webpack_require__.e(0).then(__webpack_require__.bind(null, "./src/func.js"))
		func.add(1,2)
	})
}<