CommonJS模块打包

经过前面非模块化和AMD打包的例子，本节我们就不再绕圈子，直接看例子。

HTML代码和之前仍然是一样的，不再重复，JS文件如下：

入口文件example1.1.js：

  1. var example2 = require('./example1.2');
  2. example2.sayHello();

被依赖的example1.2.js：

  1. var me = {
  2.     sayHello:function(){
  3.         alert('hello world!');
  4.     }
  5. };
  6. module.exports = me;

同样使用webpack编译就能看到相同的弹窗。

我们直接来看编译后的代码https://github.com/TooBug/webpack-guide/blob/master/examples/chapter2/commonjs/bundle1.1.js：

呃。是不是惊呆了？前41行Runtime仍然长得那个鸟样，而后面的两个模块代码，几乎和我们编写时完全一样！！唯一的改动是require被替换成了__webpack_require__了。

那就假装webpack是天然支持CommonJS的吧。所以通过这个例子也能感觉到，在使用webpack的项目中，使用CommonJS规范会省事很多。