webpack-02.js

// NOTE: This is not a complete config file, just a partial file for example
import webpack from 'webpack';
import { getIfUtils, removeEmpty } from 'webpack-config-utils';

export default env => {
  const { ifProd, ifNotProd } = getIfUtils(env);
  return {
    cache: ifProd(),
    // ------------------------------------
    // Entry Points
    // ------------------------------------
    entry: {
      app: [
        'react-hot-loader/patch',
        'babel-polyfill',
        'main.tsx'
      ]
    },
    // ------------------------------------
    // Devtool
    // ------------------------------------
    devtool: ifProd('source-map', 'source-map'),
    // ------------------------------------
    // Module
    // ------------------------------------
    module: {
      rules: removeEmpty([
        // Css/Sass loader (prod)
        ifProd({
          test: /\.scss$/,
          exclude: /node_modules/,
          loader: ExtractTextPlugin.extract({
            fallbackLoader: 'style',
            loader: 'css?modules&localIdentName=[name]__[local]___[hash:base64:5]!postcss!sass'
          })
        })
      ])
    },
    // ------------------------------------
    // Plugins
    // ------------------------------------
    plugins: removeEmpty([
      new ProgressBarPlugin(),
      new HtmlWebpackPlugin({
        template: resolve(__dirname, 'src/index.html')
      }),
      new webpack.DefinePlugin({
        'process.env': {
          NODE_ENV: ifProd('"production"', '"development"')
        }
      }),
      ifProd(new webpack.LoaderOptionsPlugin({
        minimize: true,
        debug: true
      }))
    ])
  }
}