webpack.config.js

var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var merge = require('./lib/merge');
var webpack = require('webpack');

var TARGET = process.env.TARGET;
var ROOT_PATH = path.resolve(__dirname);

var common = {
  entry: [path.join(ROOT_PATH, 'app/main.jsx')],
  resolve: {
    extensions: ['', '.js', '.jsx'],
  },
  output: {
    path: path.resolve(ROOT_PATH, 'build'),
    filename: 'bundle.js',
  },
  module: {
    preLoaders: [
      {
        test: /\.js$/,
        // define an include so we check just the files we need
        include: path.join(ROOT_PATH, 'app'),
        loader: 'jshint'
      }
    ],
    loaders: [
      {
        test: /\.css$/,
        loaders: ['style', 'css']
      },
      {
        // test for both js and jsx
        test: /\.jsx?$/,

        // use babel loader
        loader: 'babel',

        // operate only on our app directory
        include: path.join(ROOT_PATH, 'app'),
      }
    ]
  },
};

var mergeConfig = merge.bind(null, common);

if(TARGET === 'build') {
  module.exports = mergeConfig({
    module: {
      loaders: [
        {
          test: /\.jsx?$/,
          loader: 'babel',
          include: path.join(ROOT_PATH, 'app'),
        },
      ],
    },
    plugins: [
      new HtmlWebpackPlugin({
        title: 'Kanban app'
      }),
      // makes the build smaller
      new webpack.optimize.UglifyJsPlugin({
        compress: {
          warnings: false
        },
      }),
      new webpack.DefinePlugin({
        'process.env': {
          // This has effect on the react lib size
          'NODE_ENV': JSON.stringify('production'),
        }
      })
    ],
  });
}

if(TARGET === 'dev') {
  var IP = '0.0.0.0';
  var PORT = 8080;

  module.exports = mergeConfig({
    ip: IP,
    port: PORT,
    entry: [
      'webpack-dev-server/client?http://' + IP + ':' + PORT,
      'webpack/hot/dev-server',
    ],
    module: {
      // preLoaders: [
      //   {
      //     test: /\.jsx?$/,
      //     // we are using `eslint-loader` explicitly since
      //     // we have ESLint module installed. This way we
      //     // can be certain that it uses the right loader
      //     loader: 'eslint-loader',
      //     include: path.join(ROOT_PATH, 'app'),
      //   }
      // ],
      loaders: [
        {
          test: /\.jsx?$/,
          loaders: ['react-hot', 'babel'],
          include: path.join(ROOT_PATH, 'app'),
        },
      ],
    },
    output: {
      path: __dirname,
      filename: 'bundle.js',
      publicPath: '/'
    },
    plugins: [
      new webpack.HotModuleReplacementPlugin(),
      new webpack.NoErrorsPlugin(),
      new HtmlWebpackPlugin(),
    ]
  });
}