webpack到底是通过什么方式在浏览器上加载的呢

Question

最近在看webpack的相关知识，想要把它运用到项目中。 原来项目用的是requirejs,属于AMD，异步加载模块，我对amd的理解是 在浏览器上，浏览器加载编译器（requirejs）,然后根据依赖加载其他模块，这个过程是在浏览器上完成的。至于异步是指script中引用requirejs,下面还可以写其他script。下面引入的js文件可能会比上面文件很快加载。 至于webpack是在服务器端（本地）根据依赖把js文件打包好。也就是说把依赖处理的工作放在了服务器端。最后在js上直接引入就可以了。 不知道我这样的理解对不对？另外我看到webpack兼容AMD，但是它本身是在浏览器中是同步或是异步的呢？ 希望和大家交流加深理解

Answer 1

我理解的 webpack 是这样的，它打包之后，实际上生成的是一个普普通通的 js 文件而已，并没有你想象的辣么神奇。

它模块化的原理大概是下面这样的:

var a = {};

(function(a){
    //模块1
    a.module1 = '';
})(a);

(function(a){
    //引入模块1
    var module1 = a.module1;

    //模块2
    a.module2 = '';
})(a);

Answer 2

浏览器不执行什么，兼容AMD写法，也是在服务器打包好的。
你可以看一下webpack build出来的文件长啥样，就是把html，css，js模块，都放到一个js里，你有一个入口html，调用这个js。
没那么复杂