webpack.config.js

var webpack             = require('webpack'),
    ReloadPlugin        = require('webpack-reload-plugin'),
    path                = require('path'),
    ChunkManifestPlugin = require('chunk-manifest-webpack-plugin'),
    HtmlWebpackPlugin   = require('html-webpack-plugin'),
    WebpackNotifierPlugin = require('webpack-notifier'),
    ExtractTextPlugin   = require("extract-text-webpack-plugin");

/**
 * Support for extra commandline arguments
 */
var argv = require('optimist')
            .alias('r','release').default('r', false)
            .argv;

/**
 * Useful variables
 */
var cwd = process.cwd();
var DEBUG = !argv.release;
var isDevServer = process.argv.join('').indexOf('webpack-dev-server') > -1;
var version = require(path.resolve(cwd,'package.json')).version;
var reloadHost = "0.0.0.0";
var npmRoot = __dirname + "/node_modules";
var appDir = __dirname + "/app";

var entry = ["./app/app.ts"]

if (isDevServer) {
  entry.unshift("webpack-dev-server/client?http://"+reloadHost+":8080");
}

function makeConfig(options) {
  return {
    cache: true,
    debug: true,
    verbose: true,
    displayErrorDetails: true,
    displayReasons: true,
    displayChunks: true,
    context: __dirname,
    entry: {
      polyfills: './app/polyfills.ts',
      vendor: './app/vendor.ts',
      app: entry,
    },
    stats: {
      colors: true,
      reasons: DEBUG
    },
    devtool: 'source-map',
    recordsPath: path.resolve('.webpack.json'),
    devServer: {
      inline: true,
      colors: true,
      contentBase: path.resolve(cwd, "dist/"),
      publicPath: "/"
    },
    output: {
      path: path.resolve(cwd, 'public/dist'),
      filename: 'js/[name].bundle.js',
      publicPath: "/", // isDevServer ? './': './',
      chunkFilename: "[id].bundle.js",
      // Hot Module Replacement settings:
      hotUpdateMainFilename: "updates/[hash].update.json",
      hotUpdateChunkFilename: "updates/[hash].[id].update.js"
    },
    plugins: [
      new webpack.IgnorePlugin(/spec\.js$/),
      new webpack.ProvidePlugin({
        io: 'socket.io-client',
        Chart: 'chart.js/Chart.min.js'
      }),
      new webpack.optimize.OccurenceOrderPlugin(true),
      new webpack.optimize.DedupePlugin(),
      new webpack.optimize.CommonsChunkPlugin({name: ['app', 'vendor', 'polyfills'], minChunks: Infinity}),
      new ExtractTextPlugin("css/styles.css"),
      new webpack.DefinePlugin({
        VERSION: JSON.stringify(version),
        ENV: JSON.stringify(options.env)
      }),
      // new HtmlWebpackPlugin({
      //   title: 'TAO',
      //   template: path.join(appDir, "index.html"),
      // }),
      new ReloadPlugin( isDevServer ? 'localhost' : ''),
      new WebpackNotifierPlugin({
        title: 'tao_app/web',
        alwaysNotify: true
      })
    ],
    resolveLoader: {
      root: path.join(__dirname, 'node_modules'),
      modulesDirectories: ['node_modules'],
      fallback: path.join(__dirname, "node_modules")
    },
    resolve: {
      root: [path.resolve(cwd)],
      modulesDirectories: [
        'node_modules', 'bower_components', 'app', '.'
      ],
      extensions: ['', '.js', '.json', '.ts', '.tsx'],
      alias: {
        'app': 'app',
        'scripts': npmRoot
      }
    },
    module: {
      preLoaders: [
        { test: /\.ts$/, loader: "tslint" }
      ],
      loaders: [
        { test: /\.json$/, loader: 'json' },
        { test: /\.html$/, loader: 'raw' },
        { test: /^(?!.*\.min\.css$).*\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader?sourceMap")},
        { test: /\.scss$/, exclude: /node_modules/, loaders: ['raw-loader', 'sass-loader']},
        { test: /\.tsx?$/, loader: 'ts-loader', exclude: [/node_modules/] },
        { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&minetype=application/font-woff" },
        { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" }
      ],
      noParse: [
        /\.min\.js/,
        /vendor[\/\\].*?\.(js|css)$/
        // /socket.io-client/
      ],
    },
    sassLoader: {
      includePaths: [
        'node_modules', 'bower_components', 'app', '.'
      ]
    },
    tslint: {
        emitErrors: false,
        failOnHint: false
    }
  }
}
var config = makeConfig(argv)
// console.log(require('util').inspect(config, {depth: 10}))
module.exports = config;