const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const extractCSS = new ExtractTextPlugin({
filename: 'assets/[name].[hash].css',
allChunks: true
});
module.exports = {
entry: {
app: ['babel-polyfill', './client/utils/pollyfills.js', './client/index.js']
},
output: {
path: `${__dirname}/dist/`,
filename: 'assets/[name].bundle.[chunkhash].js',
chunkFilename: 'assets/[name].chunk.js',
publicPath: '/'
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
loaders: ['babel-loader'],
include: [path.resolve(__dirname, 'client')]
},
{
test: /\.(png|jpg)$/,
loader: 'url-loader?limit=8192'
},
{
test: /\.(png|svg|gif|ttf|eot|woff|woff2)$/,
loader: 'file-loader'
},
{
test: /\.css$/,
use: ['style-loader', 'css-loader', 'postcss-loader'],
exclude: [
path.resolve(__dirname, 'client'),
path.resolve(__dirname, 'node_modules', 'cas-mt4-reader-renderer')
]
},
{
test: /((.module).)*css$/,
use: extractCSS.extract({
fallback: 'style-loader',
use: [
{
loader: 'css-loader',
options: {
importLoaders: 1,
modules: true,
localIdentName: '[name]__[local]__[hash:base64:5]',
camelCase: true,
sourceMap: true
}
},
'postcss-loader'
]
}),
include: [
path.resolve(__dirname, 'client'),
path.resolve(__dirname, 'node_modules', 'cas-mt4-reader-renderer')
]
}
]
},
resolve: {
extensions: ['.js', '.jsx', '.json', '.css']
},
plugins: [
extractCSS,
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks(module) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource &&
/\.js$/.test(module.resource) &&
module.resource.indexOf(path.join(__dirname, 'node_modules')) === 0
);
}
}),
// extract webpack runtime and module manifest to its own file in order to
// prevent vendor hash from being updated whenever app bundle is updated
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
minChunks: Infinity
}),
// This instance extracts shared chunks from code splitted chunks and bundles them
// in a separate chunk, similar to the vendor chunk
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
new webpack.optimize.CommonsChunkPlugin({
name: 'app',
async: 'vendor-async',
children: true,
minChunks: 3
})
]
};