const path = require('path'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); const webpack = require('webpack'); module.exports = (config) => { if ('production' === config.mode) { return [config, module.exports.webpackConfig()]; } else { return config; } }; const SOURCE_PATH = process.env.SOURCE_PATH || '/var/node/src'; const OUTPUT_PATH = process.env.OUTPUT_PATH || '/var/node/dist'; const hashFormat = { chunk: ('production' === process.env.NODE_ENV) ? '.[chunkhash:20]' : '', } module.exports.webpackConfig = function() { const styleDirectory = path.join(SOURCE_PATH, 'styles'); const cssPrefix = '!style-loader!css-loader!'; const scssPrefix = `${cssPrefix}sass-loader!`; const config = { mode: 'production' !== process.env.NODE_ENV ? 'development' : 'production', entry: { index: [ '@babel/polyfill', path.join(SOURCE_PATH, 'frontend', 'index.js'), ], style: [ path.join(cssPrefix, styleDirectory, 'reset.css'), path.join(scssPrefix, styleDirectory, 'global.scss'), ], }, optimization: { splitChunks: { cacheGroups: { commons: { test: /(node_modules\/(?!contempo|@avocado|@truss))/, name: 'vendor', chunks: 'all', } } } }, module: { rules: [ { test: /\.js$/, exclude: [ /(node_modules\/(?!contempo|@avocado|@truss))/, ], use: { loader: 'babel-loader', options: { babelrcRoots: [ OUTPUT_PATH, ], plugins: [ 'babel-plugin-redux-saga', ['@babel/plugin-proposal-decorators', { legacy: true, }], '@babel/plugin-proposal-class-properties', '@babel/plugin-proposal-object-rest-spread', '@babel/plugin-syntax-dynamic-import', 'react-hot-loader/babel', ], presets: [ '@babel/preset-react', '@babel/preset-env', ], }, }, }, { test: /\.css$/, use: [{ loader: 'raw-loader', }], }, { test: /\.scss$/, use: [{ loader: 'raw-loader', }, { loader: 'sass-loader', options: { sourceMap: 'production' !== process.env.NODE_ENV, }, }], }, ], }, node: { fs: 'empty', }, output: { filename: `[name]${hashFormat.chunk}.js`, chunkFilename: `[id]${hashFormat.chunk}.chunk.js`, path: path.join(OUTPUT_PATH, 'frontend'), }, plugins: [ new HtmlWebpackPlugin({ title: 'Truss', template: path.join(SOURCE_PATH, 'frontend', 'index.html'), }), ], resolve: { modules: [path.join(OUTPUT_PATH, 'node_modules')], }, resolveLoader: { modules: [path.join(OUTPUT_PATH, 'node_modules')], }, }; if ('production' === config.mode) { config.optimization.minimizer = [ new UglifyJsPlugin({cache: false}) ]; } else { config.devtool = 'eval-source-map'; config.plugins.push(new webpack.HotModuleReplacementPlugin()); } return config; }