Webpack

package.json

{
  "name": "env1",
  "main": "app/main.jsx",
  "version": "0.1.0",
  "description": "Whatever",
  "dependencies": {
    "events": "~1.0.2",
    "express": "~4.12.0",
    "fastclick": "~1.0.6",
    "invariant": "~2.0.0",
    "moment": "^2.9.0",
    "normalize.css": "~3.0.2",
    "react": "~0.12.2",
    "react-intl": "^1.1.0",
    "react-router": "~0.12.4",
    "immutable": "~3.6.2",
    "superagent": "~0.21.0",
    "es6-promise": "~2.0.1",
    "browser-cookie-lite": "~1.0.4"
  },
  "devDependencies": {
    "gulp": "~3.8.11",
    "gulp-webpack": "~1.2.0",
    "jsx-loader": "~0.12.2",
    "gulp-clean": "~0.3.1",
    "run-sequence": "~1.0.2",
    "less": "~2.4.0",
    "less-loader": "~2.0.0",
    "style-loader": "~0.8.3",
    "css-loader": "~0.9.1",
    "typescript-loader": "~1.1.2",
    "webpack": "~1.6.0",
    "extract-text-webpack-plugin": "~0.3.8",
    "gulp-watch": "~4.1.1",
    "gulp-plumber": "~0.6.6",
    "gulp-nodemon": "~1.0.5",
    "gulp-replace": "~0.5.3",
    "webpack-dev-server": "~1.7.0",
    "react-hot-loader": "~1.1.5",
    "autoprefixer-loader": "~1.1.0",
    "html-webpack-plugin": "~1.1.0"
  }
}

run.cmd

gulp pre-webpack && webpack-dev-server --config .\webpack.dev.shortcut.config.js --content-base .\output\dev --hot --progress --colors --history-api-fallback --inline

webpack.config.js

var ExtractTextPlugin = require("extract-text-webpack-plugin");
var HtmlWebpackPlugin = require('html-webpack-plugin')

var path = require("path");
var webpack = require('webpack');

function merge(target, src) {
    var array = Array.isArray(src);
    var dst = array && [] || {};

    if (array) {
        target = target || [];
        dst = dst.concat(target);
        src.forEach(function(e, i) {
            if (typeof dst[i] === 'undefined') {
                dst[i] = e;
            // } else if (typeof e === 'object') {
            //     dst[i] = e;
            //     //dst[i] = deepmerge(target[i], e);
            // }
            } else {
                if (target.indexOf(e) === -1) {
                    dst.push(e);
                }
            }
        });
    } else {
        if (target && typeof target === 'object') {
            Object.keys(target).forEach(function (key) {
                dst[key] = target[key];
            })
        }
        Object.keys(src).forEach(function (key) {
            if (typeof src[key] !== 'object' || !src[key]) {
                dst[key] = src[key];
            }
            else {
                if (!target[key]) {
                    dst[key] = src[key];
                } else {
                    dst[key] = merge(target[key], src[key]);
                }
            }
        });
    }

    return dst;
}

var options = {
    entry: {
        app: path.resolve(__dirname, './source/framework/index.jsx'),
        vendors: ['react','immutable','moment']
    },
    output: {
        filename: "[name].[chunkhash].js",
        chunkFilename: "[id].[chunkhash].js",
        publicPath: '/'
    },
    resolve: {
        root: path.join(__dirname, 'source'),
        alias: {
            ui$: 'ui/ui'
        },
        extensions: ['', '.ts','.js', '.jsx']
    },
    module: {
        loaders: [{
            test: /\.ts$/,
            exclude: /node_modules/,
            loader: "typescript-loader"
        }]
    },
    plugins: [
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.[chunkHash].js'),
        new HtmlWebpackPlugin({
            filename: "index.html",
            template: 'source/framework/index.html'
        })
    ]
}

var webpackDevOptions = merge(options, {
    entry: {
        devserver: ['webpack-dev-server/client?http://localhost:8080','webpack/hot/dev-server']        
    },
    output: {
        path: path.resolve(__dirname,'/output/dev')        
    },
    devtool: 'source-map',
    module: {
        loaders: [{
            test: /\.jsx$/,
            exclude: /node_modules/,
            loaders: ["react-hot", "jsx-loader?harmony"]
        },{
            test: /\.less$/,
            exclude: /node_modules/,
            loader: "style-loader!css-loader!autoprefixer-loader!less-loader" //ExtractTextPlugin.extract("css-loader!less-loader")
        }]
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.IgnorePlugin(/vertx/)        
    ]
});



var webpackProdOptions = merge(options, {
    minimize: true,
    output: {
        path: path.resolve(__dirname,'/output/prod')
    },
    module: {
        loaders: [{
            test: /\.jsx$/,
            exclude: /node_modules/,
            loaders: ["jsx-loader?harmony"]
        },
        {
            test: /\.less$/,
            exclude: /node_modules/,
            loader: ExtractTextPlugin.extract("css-loader!autoprefixer-loader!less-loader")
        }]
    },
    plugins: [
        new ExtractTextPlugin("styles.css"), // [contenthash] for when this PR lands: https://github.com/ampedandwired/html-webpack-plugin/pull/14
        new webpack.optimize.UglifyJsPlugin({
            comments: false,
            output: {
                comments: false
            }
        }) // using output is a workarond for a webpack bug. https://github.com/webpack/webpack/issues/324
    ]
});

module.exports = {
    development: webpackDevOptions,
    production: webpackProdOptions
};