diff --git a/server.js b/server.js index 5c339e3e9d..ddf830f01b 100644 --- a/server.js +++ b/server.js @@ -1,4 +1,8 @@ /* eslint-disable no-console */ +/** + * Setup and run the development server for Hot-Module-Replacement + * https://webpack.github.io/docs/hot-module-replacement-with-webpack.html + */ import express from 'express'; import webpack from 'webpack'; diff --git a/webpack.config.base.js b/webpack.config.base.js index e5a2bdb37e..d502af9d1d 100644 --- a/webpack.config.base.js +++ b/webpack.config.base.js @@ -1,3 +1,7 @@ +/** + * Base webpack config used across other specific configs + */ + import path from 'path'; import validate from 'webpack-validator'; @@ -12,18 +16,23 @@ export default validate({ loader: 'json-loader' }] }, + output: { path: path.join(__dirname, 'dist'), filename: 'bundle.js', + + // https://github.com/webpack/webpack/issues/1114 libraryTarget: 'commonjs2' }, + + // https://webpack.github.io/docs/configuration.html#resolve resolve: { extensions: ['', '.js', '.jsx', '.json'], packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main'] }, - plugins: [ - ], + plugins: [], + externals: [ // put your node 3rd party libraries which can't be built with webpack here // (mysql, mongodb, and so on..) diff --git a/webpack.config.development.js b/webpack.config.development.js index be420e7a04..db6f69450c 100644 --- a/webpack.config.development.js +++ b/webpack.config.development.js @@ -1,4 +1,9 @@ /* eslint-disable max-len */ +/** + * Build config for development process that uses Hot-Module-Replacement + * https://webpack.github.io/docs/hot-module-replacement-with-webpack.html + */ + import webpack from 'webpack'; import validate from 'webpack-validator'; import merge from 'webpack-merge'; @@ -42,12 +47,21 @@ export default validate(merge(baseConfig, { }, plugins: [ + ...baseConfig.plugins, + + // https://webpack.github.io/docs/hot-module-replacement-with-webpack.html new webpack.HotModuleReplacementPlugin(), + + // “If you are using the CLI, the webpack process will not exit with an error code by enabling this plugin.” + // https://github.com/webpack/docs/wiki/list-of-plugins#noerrorsplugin new webpack.NoErrorsPlugin(), + + // NODE_ENV should be production so that modules do not perform certain development checks new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('development') }) ], + // https://github.com/chentsulin/webpack-target-electron-renderer#how-this-module-works target: 'electron-renderer' })); diff --git a/webpack.config.electron.js b/webpack.config.electron.js index 5b99ec1f16..3f6a8942e5 100644 --- a/webpack.config.electron.js +++ b/webpack.config.electron.js @@ -1,3 +1,7 @@ +/** + * Build config for electron 'Main Process' file + */ + import webpack from 'webpack'; import validate from 'webpack-validator'; import merge from 'webpack-merge'; @@ -8,21 +12,28 @@ export default validate(merge(baseConfig, { entry: ['babel-polyfill', './main.development'], + // 'main.js' in root output: { path: __dirname, filename: './main.js' }, plugins: [ + // Minify the output new webpack.optimize.UglifyJsPlugin({ compressor: { warnings: false } }), + + // Add source map support for stack traces in node + // https://github.com/evanw/node-source-map-support new webpack.BannerPlugin( 'require("source-map-support").install();', { raw: true, entryOnly: false } ), + + // NODE_ENV should be production so that modules do not perform certain development checks new webpack.DefinePlugin({ 'process.env': { NODE_ENV: JSON.stringify('production') @@ -30,8 +41,17 @@ export default validate(merge(baseConfig, { }) ], + /** + * Set targed to Electron speciffic node.js env. + * https://github.com/chentsulin/webpack-target-electron-renderer#how-this-module-works + */ target: 'electron-main', + /** + * Disables webpack processing of __dirname and __filename. + * If you run the bundle in node.js it falls back to these values of node.js. + * https://github.com/webpack/webpack/issues/2010 + */ node: { __dirname: false, __filename: false diff --git a/webpack.config.production.js b/webpack.config.production.js index d68b05f12c..94ab945afc 100644 --- a/webpack.config.production.js +++ b/webpack.config.production.js @@ -1,3 +1,7 @@ +/** + * Build config for electron 'Renderer Process' file + */ + import webpack from 'webpack'; import validate from 'webpack-validator'; import ExtractTextPlugin from 'extract-text-webpack-plugin'; @@ -18,6 +22,9 @@ const config = validate(merge(baseConfig, { module: { loaders: [ + ...baseConfig.module.loaders, + + // Extract all .global.css to style.css as is { test: /\.global\.css$/, loader: ExtractTextPlugin.extract( @@ -26,6 +33,7 @@ const config = validate(merge(baseConfig, { ) }, + // Pipe other styles through css modules and apend to style.css { test: /^((?!\.global).)*\.css$/, loader: ExtractTextPlugin.extract( @@ -37,19 +45,30 @@ const config = validate(merge(baseConfig, { }, plugins: [ + ...baseConfig.plugins, + + // https://webpack.github.io/docs/list-of-plugins.html#occurrenceorderplugin + // https://github.com/webpack/webpack/issues/864 new webpack.optimize.OccurrenceOrderPlugin(), + + // NODE_ENV should be production so that modules do not perform certain development checks new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('production') }), + + // Minify without warning messages and IE8 support new webpack.optimize.UglifyJsPlugin({ compressor: { screw_ie8: true, warnings: false } }), + + // Set the ExtractTextPlugin output filename new ExtractTextPlugin('style.css', { allChunks: true }) ], + // https://github.com/chentsulin/webpack-target-electron-renderer#how-this-module-works target: 'electron-renderer' })); diff --git a/webpack.config.test.js b/webpack.config.test.js index 24e3f9a479..8ad4597777 100644 --- a/webpack.config.test.js +++ b/webpack.config.test.js @@ -1,13 +1,16 @@ +/** Used in .babelrc for 'test' environment */ + // for babel-plugin-webpack-loaders require('babel-register'); -const devConfigs = require('./webpack.config.development'); const validate = require('webpack-validator'); +const devConfig = require('./webpack.config.development'); module.exports = validate({ output: { libraryTarget: 'commonjs2' }, module: { - loaders: devConfigs.module.loaders.slice(1) // remove babel-loader + // Use base + development loaders, but exclude 'babel-loader' + loaders: devConfig.module.loaders.slice(1) } });