Webpack

webpack.configuration.babel.js

import path from 'path';
import webpack from 'webpack';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import ExtractTextPlugin from 'extract-text-webpack-plugin';
import FriendlyErrorsWebpackPlugin from 'friendly-errors-webpack-plugin';

import PACKAGE from './package.json';
const banner = PACKAGE.name + ' - ' + PACKAGE.version + ' | ' +
  '(c) 2016, ' + new Date().getFullYear() + '  ' + PACKAGE.author + ' | ' +
  PACKAGE.license + ' | ' +
  PACKAGE.homepage;

const sharedConfiguration = {
  cache: true,
  context: __dirname,
  entry: {
    scripts: ["./example/example.js"],
    styles: ["./example/example.scss"]
  },
  devtool: "source-map",
  resolve: {
    extensions: ["", ".js"]
  },
  module: {
    preLoaders: [
      {
        test: /\.js$/,
        loaders: [
          "eslint",
          "eslint-loader"
        ],
        exclude: /node_modules/
      }
    ],
    loaders: [
      {
        test: /\.js$/,
        loader: "babel-loader",
        exclude: /node_modules/,
        query: {
          presets: [
            "es2015",
            "stage-0"
          ],
          plugins: [
            "syntax-trailing-function-commas",
            "transform-async-to-generator",
            "transform-es2015-destructuring",
            "transform-es2015-parameters",
            "transform-es2015-duplicate-keys",
            "transform-es2015-modules-commonjs",
            "transform-exponentiation-operator",
            "transform-decorators-legacy",
            "transform-flow-strip-types",
            "transform-runtime"
          ]
        }
      },
      {
        test: /\.(scss|sass)$/,
        loader: ExtractTextPlugin.extract("style-loader", "css-loader?sourceMap!resolve-url-loader!sass-loader?sourceMap")
      },
      {
        test: /\.html$/,
        loaders: ["html-loader"]
      },
      {
        test: /\.(jpg|png|woff|woff2|eot|ttf|svg|ico)$/,
        loader: "file-loader?name=[name]-[hash].[ext]"
      },
      {
        test: /\.(json|geojson)$/,
        loader: "json-loader",
        exclude: /node_modules/
      }
    ]
  },
  eslint: {
    configFile: './.eslintrc'
  }
};

const developmentConfiguration = {
  watch: true,
  output: {
    pathinfo: true,
    filename: "[name]-[chunkhash].js",
    path: path.resolve("./dist")
  },
  devServer: {
    port: 38100
  },
  plugins: [
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false
      }
    }),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new ExtractTextPlugin("[name]-[chunkhash].css"),
    new webpack.optimize.CommonsChunkPlugin({
      name: "vendor",
      minChunks: Infinity
    }),
    new HtmlWebpackPlugin({
      template: "./example/example.ejs",
      favicon: "favicon.ico",
      inject: false,
      minify: {
        collapseWhitespace: true,
        removeComments: true
      }
    }),
    new FriendlyErrorsWebpackPlugin(),
    new webpack.BannerPlugin(banner)
  ]
};

let environmentConfiguration = developmentConfiguration;

const configuration = {
  ...sharedConfiguration,
  ...environmentConfiguration
};

export default configuration;