Enhance webpack config

Author: zalmoxisus

gulpfile.babel.js

@@ -5,6 +5,8 @@ import jade from 'gulp-jade';
 import rename from 'gulp-rename';
 import zip from 'gulp-zip';
 import webpack from 'webpack';
+import devConfig from './webpack/dev.config';
+import prodConfig from './webpack/prod.config';
 
 /*
  * common tasks
@@ -25,8 +27,7 @@ gulp.task('replace-webpack-code', () => {
  */
 
 gulp.task('webpack:dev', (callback) => {
-  let myConfig = Object.create(require('./webpack/dev.config'));
-  webpack(myConfig, (err, stats) => {
+  webpack(devConfig, (err, stats) => {
     if (err) {
       throw new gutil.PluginError('webpack:dev', err);
     }
@@ -55,8 +56,7 @@ gulp.task('copy:dev', () => {
  */
 
 gulp.task('webpack:build:extension', (callback) => {
-  let myConfig = Object.create(require('./webpack/prod.config'));
-  webpack(myConfig, (err, stats) => {
+  webpack(prodConfig, (err, stats) => {
     if (err) {
       throw new gutil.PluginError('webpack:build', err);
     }

webpack/base.config.js

@@ -3,32 +3,56 @@ import webpack from 'webpack';
 
 const extpath = path.join(__dirname, '../src/browser/extension/');
 
-export default {
-  entry: {
-    background: [ extpath + 'background/index' ],
-    options: [ extpath + 'options/index' ],
-    window: [ extpath + 'window/index' ],
-    devpanel: [ extpath + 'devpanel/index' ],
-    devtools: [ extpath + 'devtools/index' ],
-    content: [ extpath + 'inject/contentScript' ],
-    page: [ extpath + 'inject/pageScript' ],
-    inject: [ extpath + 'inject/index' ]
+const baseConfig = (params) => ({
+  entry: params.input || {
+    background: [ `${extpath}background/index` ],
+    options: [ `${extpath}options/index` ],
+    window: [ `${extpath}window/index` ],
+    devpanel: [ `${extpath}devpanel/index` ],
+    devtools: [ `${extpath}devtools/index` ],
+    content: [ `${extpath}inject/contentScript` ],
+    page: [ `${extpath}inject/pageScript` ],
+    inject: [ `${extpath}inject/index` ],
+    ...params.inputExtra
   },
   output: {
     filename: '[name].bundle.js',
-    chunkFilename: '[id].chunk.js'
+    chunkFilename: '[id].chunk.js',
+    ...params.output
   },
+  plugins: [
+    new webpack.DefinePlugin(params.globals),
+    ...(params.plugins ? params.plugins :
+      [
+        new webpack.optimize.DedupePlugin(),
+        new webpack.optimize.UglifyJsPlugin({
+          comments: false,
+          compressor: {
+            warnings: false
+          }
+        })
+      ])
+  ],
   resolve: {
+    alias: {
+      app: path.join(__dirname, '../src/app'),
+      tmp: path.join(__dirname, '../build/tmp')
+    },
     extensions: ['', '.js']
   },
   module: {
-    loaders: [{
-      test: /\.js$/,
-      loaders: ['babel'],
-      exclude: /node_modules/
-    }, {
-      test: /\.css?$/,
-      loaders: ['style', 'raw']
-    }]
+    loaders: [
+      ...(params.loaders ? params.loaders : [{
+        test: /\.js$/,
+        loaders: ['babel'],
+        exclude: /node_modules/
+      }]),
+      {
+        test: /\.css?$/,
+        loaders: ['style', 'raw']
+      }
+    ]
   }
-};
+});
+
+export default baseConfig;

webpack/dev.config.js

@@ -1,17 +1,20 @@
 import path from 'path';
 import webpack from 'webpack';
-import config from './base.config';
+import baseConfig from './base.config';
 
-config.output.path = path.join(__dirname, '../dev/js');
-config.plugins = [
-  new webpack.DefinePlugin({
+let config = baseConfig({
+  output: { path: path.join(__dirname, '../dev/js') },
+  globals: {
     'process.env': {
       NODE_ENV: '"development"'
     }
-  }),
-  new webpack.optimize.OccurenceOrderPlugin(),
-  new webpack.NoErrorsPlugin()
-];
+  },
+  plugins: [
+    new webpack.optimize.OccurenceOrderPlugin(),
+    new webpack.NoErrorsPlugin()
+  ]
+});
+
 config.watch = true;
 
-export default config;
+export default config;

webpack/prod.config.js

@@ -1,21 +1,12 @@
 import path from 'path';
 import webpack from 'webpack';
-import config from './base.config';
+import baseConfig from './base.config';
 
-config.output.path = path.join(__dirname, '../build/extension/js');
-config.plugins = [
-  new webpack.DefinePlugin({
+export default baseConfig({
+  output: { path: path.join(__dirname, '../build/extension/js') },
+  globals: {
     'process.env': {
       NODE_ENV: '"production"'
     }
-  }),
-  new webpack.optimize.DedupePlugin(),
-  new webpack.optimize.UglifyJsPlugin({
-    comments: false,
-    compressor: {
-      warnings: false
-    }
-  })
-];
-
-export default config;
+  }
+});