const webpack = require('webpack');  
const path = require('path');  
const isDebug = process.env.NODE_ENV === 'development';  
const outputPath = isDebug ? path.join(__dirname, '../common/debug')  
: path.join(__dirname, '../common/dist');
const fileName = '[name].js';
 
// 資源依賴包，提前編譯
const lib = [  
  'react',
  'react-dom',
  'react-router',
  'history',
  'react-addons-pure-render-mixin',
  'react-addons-css-transition-group',
  'redux',
  'react-redux',
  'react-router-redux',
  'redux-actions',
  'redux-thunk',
  'immutable',
  'whatwg-fetch',
  'byted-people-react-select',
  'byted-people-reqwest'
];
 
const plugin = [  
  new webpack.DllPlugin({
    /**
     * path
     * 定義 manifest 檔案生成的位置
     * [name]的部分由entry的名字替換
     */
    path: path.join(outputPath, 'manifest.json'),
    /**
     * name
     * dll bundle 輸出到那個全域性變數上
     * 和 output.library 一樣即可。
     */
    name: '[name]',
    context: __dirname
  }),
  new webpack.optimize.OccurenceOrderPlugin()
];
 
if (!isDebug) {  
  plugin.push(
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    }),
    new webpack.optimize.UglifyJsPlugin({
      mangle: {
        except: ['$', 'exports', 'require']
      },
      compress: { warnings: false },
      output: { comments: false }
    })
  )
}
 
module.exports = {  
  devtool: '#source-map',
  entry: {
    lib: lib
  },
  output: {
    path: outputPath,
    filename: fileName,
    /**
     * output.library
     * 將會定義為 window.${output.library}
     * 在這次的例子中，將會定義為`window.vendor_library`
     */
    library: '[name]',
    libraryTarget: 'umd',
    umdNamedDefine: true
  },
  plugins: plugin
};

然後執行命令：

$ NODE_ENV=development webpack --config  webpack.dll.lib.js --progress
$ NODE_ENV=production webpack --config  webpack.dll.lib.js --progress