webpack

webpack 相关文章

webpack 是以 commonJS 的形式来书写脚本滴，但对 AMD/CMD 的支持也很全面，方便旧项目进行代码迁移。

能被模块化的不仅仅是 JS 了。

开发便捷，能替代部分 grunt/gulp 的工作，比如打包、压缩混淆、图片转base64等。

扩展性强，插件机制完善，特别是支持 React 热插拔（见 react-hot-loader ）的功能让人眼前一亮。

webpack中文文档
 http://www.tuicool.com/articles/3Yr6Nnr

插件CommonsChunkPlugin

一般会把jQuery、react、angular等框架或者库打包成一个文件，因为不会经常更改，可以长时间的缓存在用户的浏览器上。

入口和出口：

entry: {
    app: ["./polyfills", "./app"],
    vendor: [
        'react'
        'rect-dom',
        'react-router'
    ]
},
output: {
    filename: 'static/js/[name].[chunkhash:8].js',
    publicPath: publicPath
}

这样打包会把应用打包成 app.js 和 vendor.js ，乍一看没问题，把第三方的框架或库和自己的代码分开了打包。其实 app.js 中引用了第三方的库框架，导致webpack也打包了 vendor 的代码到 app.js 中。重复打包了。

加上CommonsChunkPlugin，webpack才不会把 vendor 中的代码打包进 app.js 中。

new webpack.optimize.CommonsChunkPlugin({
    name : 'vendor'// also can a array
})