webpack example config

webpack.config.js

'use strict';

const ExtractTextPlugin = require('extract-text-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
const writeStats = require('./utils/write-stats');
const postcssUse = require('postcss-use');
const autoprefixer = require('autoprefixer');
const config = require('./config');

const GLOBALS = {
    'process.env': {
        NODE_ENV: JSON.stringify('production')
    }
};

module.exports = {
    devtool: 'source-map',
    context: config.SOURCE_DIR,
    entry: {
        app: './scripts/client.js',
        vendors: ['babel-core/polyfill'].concat(config.DEPENDENCIES)
    },
    output: {
        path: config.RELEASE_DIR,
        filename: 'js/[name].[chunkhash].js',
        chunkFilename: 'js/[name].[chunkhash].js',
        publicPath: '/'
    },
    module: {
        loaders: [
            {test: config.REGEX.IMG,  loader: 'url-loader?limit=500&name=/images/[hash].[ext]'},
            {test: config.REGEX.JS,   loader: 'babel?optional[]=runtime', exclude: config.REGEX.NODE_MODULES},
            {test: config.REGEX.CSS,  loader: ExtractTextPlugin.extract('css-loader!postcss-loader')},
            {test: config.REGEX.CSSM, loader: ExtractTextPlugin.extract('css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64]!postcss-loader')}
        ]
    },
    plugins: [
        new ExtractTextPlugin('css/[name].[contenthash].css', {allChunks: true}),
        new webpack.optimize.CommonsChunkPlugin({name: 'vendors'}),
        new webpack.optimize.CommonsChunkPlugin({name: 'meta', chunks: ['vendors']}),
        new webpack.DefinePlugin(GLOBALS),
        new webpack.optimize.DedupePlugin(),
        new webpack.optimize.AggressiveMergingPlugin(),
        new webpack.optimize.UglifyJsPlugin({compress: {warnings: false}}),
        function() {this.plugin('done', writeStats(config.STATS_FILE))},
        new HtmlWebpackPlugin({templateContent: config.renderIndexHtml})
    ],
    resolve: {
        modulesDirectories: ['src/scripts', 'node_modules'],
        extensions: ['', '.json', '.js']
    },
    postcss: () => [
        postcssUse({ modules: '*'}),
        require('autoprefixer')
    ]
};