webpack react 热部署配置

写了个redux实用的例子，顺便用一下webpack做了一些打包工作，没想到折腾了挺久配置，稍微记一下

1. react
2. react 热部署
3. es6、stage-0
4. 通用js lib提取
5. less合并为文件

npm scripts

"dev": "webpack-dev-server --devtool eval --progress --colors --hot --inline --content-base build"

webpack.config.js

"use strict";

const path = require('path');
const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    entry: {
        main: path.resolve(__dirname, 'src/app.js'),
        vendor: ['react', 'react-dom', 'redux', 'react-redux', 'immutable']
    },
    output: {
        //path: path.resolve(__dirname, 'build'),
        filename: 'bundle.js'
    },
    plugins: [
        new CommonsChunkPlugin('vendor', 'vendor.bundle.js'),
        new ExtractTextPlugin('bundle.css')
    ],
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                loaders: [
                    'react-hot',
                    'babel?{presets:["es2015","stage-0","react"]}'
                ]
            },
            {
                test: /\.less/,
                loader: ExtractTextPlugin.extract('style', 'css!less')
            }
        ]
    }
};