webpack.js

//** Dependencies **//
const path = require('path');
const webpack = require('webpack');


//** Options **//
const paths = require('./paths.js').paths;
const envUtil = require('../util/env');


//** Main **//
const env = envUtil();

//** Export **//
module.exports = {
    module: {
        loaders: [{
            test: /\.js$/,
            exclude: /(node_modules|bower_components)/,
            loader: 'babel',
            query: {
                // TODO: this is a workaround to ensure babel-loader finds its preset
                //     see: https://github.com/babel/babel-loader/issues/149
                //     see: https://github.com/babel/babel-loader/issues/166
                // TODO: When this issue is resolved, exchange the code with following lines:
                // plugins: ['lodash'],
                // presets: ['es2015']
                plugins: [require.resolve('babel-plugin-lodash')],
                presets: [
                    [
                        require.resolve('babel-preset-es2015'),
                        {
                            modules: false,
                        },
                    ],
                ],
                cacheDirectory: true,
            }
        }, {
            test: /\.html$/,
            exclude: /(node_modules|bower_components)/,
            loader: 'html-loader'
        }, {
            test: /\.json$/,
            exclude: /(node_modules|bower_components)/,
            loader: 'json-loader'
        }]
    },
    externals: {
        modernizr: 'Modernizr',
    },
    entry: {
        app: [
            path.join(paths.src, 'js/app/main/index.js')
        ]
    },
    output: {
        filename: '[name]/index.js',
        devtoolModuleFilenameTemplate: 'source-webpack:///[resource-path]',
        devtoolFallbackModuleFilenameTemplate: 'source-webpack:///[resourcePath]?[hash]'
    },
    plugins: [
        new webpack.ProvidePlugin({
            'globals': 'main/config',
            THREE: 'three',
        }),
        new webpack.BannerPlugin(`
         _/                      _/                      _/
    _/_/_/  _/  _/_/    _/_/        _/_/_/      _/_/    _/
 _/    _/  _/_/      _/_/_/_/  _/  _/    _/  _/    _/  _/
_/    _/  _/        _/        _/  _/    _/  _/    _/  _/
 _/_/_/  _/          _/_/_/  _/  _/_/_/      _/_/    _/
                                _/
                               _/  Interaction Design

${ new Date() }
        `)
    ],
    devtool: (env.is(env.types.DIST) ? '' : '#source-map'),
    resolve: {
        extensions: ['*', '.js'],
        modules: [
            path.resolve(paths.frontend, 'node_modules'),
            path.resolve(paths.src, 'js/app')
        ],
    },
    resolveLoader: {
        modules: [
            path.resolve(paths.frontend, 'node_modules')
        ]
    }
};