webpack.config.ts

import path = require("path");
import * as webpack from "webpack";
import {getCommonBuildOptions, getEnvironments} from "./BuildOptions";
import {HotModuleReplacementPlugin, LoaderOptionsPlugin, NamedModulesPlugin} from "webpack";
import CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
const {BundleAnalyzerPlugin} = require("webpack-bundle-analyzer");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const HtmlWebpackPlugin = require("webpack-html-plugin");

const fileLoader = {
  loader: "file-loader",
  options: {
    name: "assets/[hash].[ext]"
  }
};

const imageCompressionLoader = {
  loader: "image-webpack-loader",
  options: {
    mozjpeg: {progressive: true, quality: 65},
    optipng: {enabled: false},
    pngquant: {quality: "65-90", speed: 4},
    gifsicle: {interlaced: false},
    webp: {quality: 75}
  }
};

const flowRemoveTypes = require("flow-remove-types");
const loaderUtils = require("loader-utils");

function flowRemoveTypesLoader (source: any) {
  this.cacheable();

  const options = Object.assign({}, loaderUtils.getOptions(this));
  const removed = flowRemoveTypes(source, options).toString();
  
  console.log(removed);
  
  return removed;
}

// NOTE webpack requires a default export
// noinspection TsLint
export default function webpackConfig (env: any = {}): webpack.Configuration {
  const {ocast, node, ...additionalOptions} = env;
  const {ocastEnv, nodeEnv} = getEnvironments(ocast, node);
  const options = {
    ...getCommonBuildOptions(ocastEnv, nodeEnv),
    ...additionalOptions
  };

  const extensions = [".ts", ".tsx", ".js", ".jsx"];
  return {
    entry: compact([
      //path.join(__dirname, "app", "src", "polyfills", "index.js"),
      options.hmr && "react-hot-loader/patch",
      path.join(__dirname, "app", "src", "client.js")
    ]),
    output: {
      path: path.join(__dirname, options.outputFolder),
      filename: "app.js"
    },
    cache: options.cache,
    devtool: options.sourceMaps ? "source-map" : undefined,
    resolve: {
      extensions,
      modules: [
        path.join(__dirname, "app"),
        "node_modules"
      ],
      alias: {
        aphrodite: "aphrodite/no-important",
        src: path.join(__dirname, "app", "src")
      }
    },
    plugins: compact([
      new HtmlWebpackPlugin({filename: "index.html"}),
      new webpack.DefinePlugin({
        "process.env": {
          NODE_ENV: JSON.stringify(nodeEnv),
          OCAST_CONFIG: JSON.stringify(ocastEnv)
        }
      }),
      new ExtractTextPlugin("styles.css"),
      //new webpack.NormalModuleReplacementPlugin(/^react?$/, require.resolve("react")),
      //new BundleAnalyzerPlugin({analyzerMode: "static"}),
      new CommonsChunkPlugin({
        name: "vendor",
        filename: "vendor.js",
        minChunks: module => module.context && module.context.indexOf("node_modules") >= 0
      }),

      options.hmr && new NamedModulesPlugin(),
      options.hmr && new HotModuleReplacementPlugin(),
      options.debug && new LoaderOptionsPlugin({debug: true})
    ]),
    module: {
      rules: [
        {
          test: /\.jsx?/,
          exclude: /node_modules/,
          use: compact([
            options.hmr && "react-hot-loader/webpack",
            {
              loader: "babel-loader",
              options: {
                presets: ["flow", "react", "stage-0"]
              }
            }
          ])
        },
        {
          test: /\.tsx?/,
          exclude: /node_modules/,
          use: compact([
            options.hmr && "react-hot-loader/webpack",
            "ts-loader"
          ])
        },
        {
          test: /\.(png|jpe?g)$/,
          exclude: /node_modules/,
          use: compact([
            fileLoader,
            options.compress && imageCompressionLoader
          ])
        },
        {
          test: /\.json$/,
          use: "json-loader"
        },
        {
          test: /\.css$/,
          use: ExtractTextPlugin.extract({
            fallback: "style-loader",
            use: "css-loader"
          })
        },
        {
          test: /\.(ttf|eot|woff|woff2|svg)$/,
          use: fileLoader
        }
      ]
    },
    devServer: {
      hot: options.hmr
    }
  };
};

function compact<T> (array: T[]) {
  return array.filter(item => item);
}