概念
本质上,webpack 是一个用于现代 JavaScript 应用程序的 静态模块打包工具。当 webpack 处理应用程序时,它会在内部从一个或多个入口点构建一个 依赖图(dependency graph),然后将你项目中所需的每一个模块组合成一个或多个 bundles,它们均为静态资源,用于展示你的内容。
普通的函数
// ! function (形参){加载器构建}(功能模块)
!function (x,y){
console.log("x",x)
console.log("y",y)
}(33, 44)
以数字调度
!function (e) {
var t = {};
function n(r) {
if (t[r])
return t[r].exports;
var o = t[r] = {
i: r,
l: !1,
exports: {}
};
e[r].call(o.exports, o, o.exports, n);
return o.exports.exports;
}
// 调度器调度
// console.log(n(0))
console.log(n(1))
}([ function () {
console.log("f1");
this.exports = 111;
},
function () {
console.log("f2");
this.exports = 222;
}]
);
以哈希调度
// 哈希调度
window = global;
!function (e) {
var t = {};
function n(r) {
if (t[r])
return t[r].exports;
var o = t[r] = {
i: r,
l: !1,
exports: {}
};
e[r].call(o.exports, o, o.exports, n);
return o.exports.exports;
}
window.loader = n
// 调度器调度
console.log(n("111"))
console.log(n("222"))
}(
{
"111": function () {
console.log("f1");
this.exports = 1;
},
"222":
function () {
console.log("f2");
this.exports = 2;
}
}
);
// 调度某个函数
console.log(window.loader("111"))
console.log(window.loader("222"))