From d10b974545fb7bb197fc346ef3b6eafef4cd1ca2 Mon Sep 17 00:00:00 2001
From: KevinMidboe <kevin.midboe@gmail.com>
Date: Tue, 24 Oct 2017 23:01:44 +0200
Subject: [PATCH] Changed to now use a prod and a dev webpack config. Our prod
 config now minifies and sets up caching for us. Package json now has build
 command.

---
 client/package.json      |  7 +++++--
 client/webpack.common.js | 34 ++++++++++++++++++++++++++++++++++
 client/webpack.config.js | 33 ---------------------------------
 client/webpack.dev.js    | 17 +++++++++++++++++
 client/webpack.prod.js   | 28 ++++++++++++++++++++++++++++
 5 files changed, 84 insertions(+), 35 deletions(-)
 create mode 100644 client/webpack.common.js
 delete mode 100644 client/webpack.config.js
 create mode 100644 client/webpack.dev.js
 create mode 100644 client/webpack.prod.js

diff --git a/client/package.json b/client/package.json
index 38c7c71..923cc33 100644
--- a/client/package.json
+++ b/client/package.json
@@ -6,9 +6,11 @@
   "author": "Kevin Midboe",
   "license": "MIT",
   "scripts": {
-    "start": "webpack-dev-server"
+    "start": "webpack-dev-server --open --config webpack.dev.js",
+    "build": "webpack --config webpack.prod.js"
   },
   "dependencies": {
+    "clean-webpack-plugin": "^0.1.17",
     "css-loader": "^0.28.4",
     "html-webpack-plugin": "^2.28.0",
     "path": "^0.12.7",
@@ -27,7 +29,8 @@
     "urijs": "^1.18.12",
     "webfontloader": "^1.6.28",
     "webpack": "^3.5.5",
-    "webpack-dev-server": "^2.4.5"
+    "webpack-dev-server": "^2.4.5",
+    "webpack-merge": "^4.1.0"
   },
   "devDependencies": {
     "babel-core": "^6.26.0",
diff --git a/client/webpack.common.js b/client/webpack.common.js
new file mode 100644
index 0000000..114c775
--- /dev/null
+++ b/client/webpack.common.js
@@ -0,0 +1,34 @@
+/*
+* @Author: KevinMidboe
+* @Date:   2017-06-01 19:09:16
+* @Last Modified by:   KevinMidboe
+* @Last Modified time: 2017-10-24 21:55:41
+*/
+
+const path = require('path');
+const CleanWebpackPlugin = require('clean-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+module.exports = {
+	entry: {
+		app: './app/index.js',
+	},
+	plugins: [
+		new CleanWebpackPlugin(['dist']),
+		new HtmlWebpackPlugin({
+			template: './app/index.html',
+		})
+	],
+	 module: {
+	 	loaders: [
+	 		{ test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
+	 		{ test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ },
+	 	]
+	 },
+
+	output: {
+		filename: '[name].bundle.js',
+		path: path.resolve(__dirname, 'dist')
+	}
+};
+
diff --git a/client/webpack.config.js b/client/webpack.config.js
deleted file mode 100644
index e6c383e..0000000
--- a/client/webpack.config.js
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
-* @Author: KevinMidboe
-* @Date:   2017-06-01 19:09:16
-* @Last Modified by:   KevinMidboe
-* @Last Modified time: 2017-09-02 15:51:52
-*/
-
-const path = require('path');
-
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const HtmlWebpackPluginConfig = new HtmlWebpackPlugin({
-	template: './app/index.html',
-	filename: 'index.html',
-	inject: 'body'
-})
-
-module.exports = {
-	entry: './app/index.js',
-	output: {
-		path: path.resolve('dist'),
-		filename: 'index_bundle.js'
-	},
-	devServer: {
-		headers: {'Access-Control-Allow-Origin': '*'}
-	},
-	module: {
-		loaders: [
-				{ test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
-				{ test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ },
-    	]
-  	},
-  	plugins: [HtmlWebpackPluginConfig]
-};
\ No newline at end of file
diff --git a/client/webpack.dev.js b/client/webpack.dev.js
new file mode 100644
index 0000000..bdef6dd
--- /dev/null
+++ b/client/webpack.dev.js
@@ -0,0 +1,17 @@
+/*
+* @Author: KevinMidboe
+* @Date:   2017-06-01 19:09:16
+* @Last Modified by:   KevinMidboe
+* @Last Modified time: 2017-10-24 22:12:52
+*/
+
+const merge = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+	devtool: 'inline-source-map',
+	devServer: {
+		contentBase: './dist',
+		headers: {'Access-Control-Allow-Origin': '*'}
+	}
+});;
diff --git a/client/webpack.prod.js b/client/webpack.prod.js
new file mode 100644
index 0000000..9106449
--- /dev/null
+++ b/client/webpack.prod.js
@@ -0,0 +1,28 @@
+/*
+* @Author: KevinMidboe
+* @Date:   2017-06-01 19:09:16
+* @Last Modified by:   KevinMidboe
+* @Last Modified time: 2017-10-24 22:26:29
+*/
+
+const merge = require('webpack-merge');
+const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const common = require('./webpack.common.js');
+var webpack = require('webpack')
+
+module.exports = merge(common, {
+	plugins: [
+		new UglifyJSPlugin(),
+		new HtmlWebpackPlugin({
+			template: './app/index.html',
+		 	title: 'Caching'
+		}),
+		new webpack.DefinePlugin({
+			'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
+		}),
+	],
+	output: {
+		filename: '[name].[chunkhash].js',
+	}
+});