webpack

首先说明在接触webPack之前，我绝对是一个requirejs的粉，本着无聊玩新技术的态度，在项目中用了webPack。

首先列举一下比较官方的总结：

特点

• 模块打包（基本功能）
• 支持CommonJs和AMD（Bowserify,RequireJS,是个亮点） 
  
  • 可以混合使用， commonjs 与amd模块，方案上webpack作用原理更类似于Bowserify，只是增加了异步加载的功能。
• source-map支持(debug调试必须的，requreJs也有)
• 支持模块按需加载(requirejs)
• 任何用到的资源都可作为模块被require(js/css/html/markdown/图片/字体/html…)||（requrieJs）
• 预编译(stylus/sass/less/coffeescript/jsx/图片转base64…)||（requrieJs 也提供sass,less,coffe,jsx的预编译的插件）
• 优化: 压缩/文件缓存（自带根据hash值做文件缓存相比requirejs是个小亮点，requirejs是配置公用参数导致所有文件都会被更新）

• 多点页面切分公共代码（官方亮点，通过CommonsChunkPlugin自动提取多个入口JS的公共部分生成common.js）

• 开发模式下支持代码的热替换（requireJs不需要，Bowserify与webPack在开发模式下服务器编译生成bundle.js，通过gulp的watch也可以但是效率太低）

• 单独打包css，合并入js。

  • 支持@import ” “
  • 相比于requirejs，在模块中加载css时，可以配置将css从js中分离出，而不是打进js（个人感觉比较奇怪，不想打进js，为什么要在js中require，破坏了依赖关系)
  • 可以选择作为link还是style dom插入（）
  • 可以通过调用，移除css（对于开发来说是个亮点，改变了设计组件的方法，实现了将css ，template， js 打成一个包，一起调用一起注销。）

• weboack的打包方式完全走本地