Make Aurelia webpack config as consistent as possible with the other templates

Author: SteveSandersonMS

templates/AureliaSpa/webpack.config.js

@@ -1,30 +1,28 @@
 const path = require('path');
 const webpack = require('webpack');
 const { AureliaPlugin } = require('aurelia-webpack-plugin');
+const bundleOutputDir = './wwwroot/dist';
 
-module.exports = ({ prod } = {}) => {
-    const isDevBuild = !prod;
-    const isProdBuild = prod;
-    const bundleOutputDir = './wwwroot/dist';
-
-    return {
+module.exports = (env) => {
+    const isDevBuild = !(env && env.prod);
+    return [{
+        stats: { modules: false },
+        entry: { 'app': 'aurelia-bootstrapper' },
         resolve: {
-            extensions: [".ts", ".js"],
-            modules: ["ClientApp", "node_modules"],
+            extensions: ['.ts', '.js'],
+            modules: ['ClientApp', 'node_modules'],
         },
-        entry: { 'app': 'aurelia-bootstrapper' },
         output: {
             path: path.resolve(bundleOutputDir),
-            publicPath: "/dist/",
+            publicPath: '/dist/',
             filename: '[name].js'
         },
         module: {
             rules: [
-                { test: /\.css$/i, use: [isDevBuild ? 'css-loader' : 'css-loader?minimize'] },
-                { test: /\.html$/i, use: ["html-loader"] },
-                { test: /\.ts$/i, loaders: ['ts-loader'], exclude: path.resolve(__dirname, 'node_modules') },
-                { test: /\.json$/i, loader: 'json-loader', exclude: path.resolve(__dirname, 'node_modules') },
-                { test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader', query: { limit: 8192 } }
+                { test: /\.ts$/i, include: /ClientApp/, use: 'ts-loader?silent=true' },
+                { test: /\.html$/i, use: 'html-loader' },
+                { test: /\.css$/i, use: isDevBuild ? 'css-loader' : 'css-loader?minimize' },
+                { test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' }
             ]
         },
         plugins: [
@@ -33,19 +31,14 @@ module.exports = ({ prod } = {}) => {
                 context: __dirname,
                 manifest: require('./wwwroot/dist/vendor-manifest.json')
             }),
-            new AureliaPlugin({ aureliaApp: "boot" }),
-            ...when(isDevBuild, [
-                new webpack.SourceMapDevToolPlugin({
-                    filename: '[file].map',
-                    moduleFilenameTemplate: path.relative(bundleOutputDir, '[resourcePath]')
-                })
-            ]),
-            ...when(isProdBuild, [
-                new webpack.optimize.UglifyJsPlugin()
-            ])
-        ]
-    };
+            new AureliaPlugin({ aureliaApp: 'boot' })
+        ].concat(isDevBuild ? [
+            new webpack.SourceMapDevToolPlugin({
+                filename: '[file].map', // Remove this line if you prefer inline source maps
+                moduleFilenameTemplate: path.relative(bundleOutputDir, '[resourcePath]')  // Point sourcemap entries to the original file locations on disk
+            })
+        ] : [
+            new webpack.optimize.UglifyJsPlugin()
+        ])
+    }];
 }
-
-const ensureArray = (config) => config && (Array.isArray(config) ? config : [config]) || []
-const when = (condition, config, negativeConfig) => condition ? ensureArray(config) : ensureArray(negativeConfig)

templates/AureliaSpa/webpack.config.vendor.js

@@ -6,7 +6,8 @@ var extractCSS = new ExtractTextPlugin('vendor.css');
 module.exports = ({ prod } = {}) => {
     const isDevBuild = !prod;
 
-    return {
+    return [{
+        stats: { modules: false },
         resolve: {
             extensions: ['.js']
         },
@@ -51,5 +52,5 @@ module.exports = ({ prod } = {}) => {
         ].concat(isDevBuild ? [] : [
             new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } })
         ])
-    }
+    }]
 };