webpack系列 —— 模块化原理-CommonJS

CommonJS 是以在浏览器环境之外构建 JavaScript 生态系统为目标而产生的项目，比如在服务器和桌面环境中。

CommonJS 规范是为了解决 JavaScript 的作用域问题而定义的模块形式，可以使每个模块它自身的命名空间中执行。该规范的主要内容是，模块必须通过 module.exports 导出对外的变量或接口，通过 require() 来导入其他模块的输出到当前模块作用域中。     —— 《Webpack 中文指南》

一个直观的例子：

// moduleA.js
module.exports = function( value ){
    return value * 2;
}

// moduleB.js
var multiplyBy2 = require('./moduleA');
var result = multiplyBy2(4);

CommonJS 是同步加载模块，但其实也有浏览器端的实现，其原理是现将所有模块都定义好并通过 id 索引，这样就可以方便的在浏览器环境中解析了，可以参考 require1k 和 tiny-browser-require 的源码来理解其解析（resolve）的过程。（ 更多关于 CommonJS 规范的内容请查看 http://wiki.commonjs.org/wiki/CommonJS ）

webpack是基于node.js开发的，而node.js开发的模块化规范是commonJS.

webpack npm node之间关系？

• webpack是npm生态中的一个模块，我们可以通过全局安装webpack来使用webpack对项目进行打包；
• webpack的运行依赖于node的环境，没有node是不能打包的，但是webpack打包后的项目本身只是前端静态资源和后台没有关系，也就是说不依赖与node，只要有后台能力的都可以部署项目
• npm是于Node社区中产生的，是nodejs的官方包管理工具，当你下载安装好node的时候，npm cli就自动安装好了
• 正是因为npm的包管理，使得项目可以模块化的开发，而模块化的开发带来的这些改进确实大大的提高了我们的开发效率，但是利用它们开发的文件往往需要进行额外的处理才能让浏览器识别，而手动处理又是非常繁琐的，这就是webpack工具存在的意义

webpack的核