Address #1 by adding a build process for renderer and main

package.json

@@ -4,8 +4,10 @@
   "description": "Barebones starter kit with TypeScript, React, react-router, and Jest",
   "main": "dist/main.js",
   "scripts": {
-    "build": "",
-    "dev:main": "cross-env NODE_ENV=development webpack --config webpack.main.js && ./node_modules/.bin/electron dist/main.js",
+    "build": "npm run build:renderer && npm run build:main",
+    "build:main": "webpack --config webpack.main.js",
+    "build:renderer": "webpack --config webpack.renderer.prod.js",
+    "dev:main": "cross-env NODE_ENV=development webpack --config webpack.main.js && electron dist/main.js",
     "dev:renderer": "cross-env NODE_ENV=development webpack-dev-server --config webpack.renderer.js",
     "lint": "./node_modules/.bin/tslint -c \"tslint.json\" -e \"node_modules/**/*\"  \"./src/**/*.{ts,tsx}\"",
     "precommit-msg": "echo 'Pre-commit checks...' && exit 0",
@@ -30,6 +32,7 @@
     "@types/react": "^16.3.17",
     "@types/react-dom": "^16.0.6",
     "@types/react-router-dom": "^4.2.7",
+    "aws-sdk": "^2.254.1",
     "babel-core": "^6.26.3",
     "babel-loader": "^7.1.4",
     "babel-plugin-import": "^1.7.0",

src/main.ts

@@ -1,54 +1,45 @@
 import { app, BrowserWindow } from 'electron';
 import * as path from 'path';
-
-require('electron-reload')(__dirname);
+import * as url from 'url';
 
 let mainWindow: Electron.BrowserWindow;
 
-function createWindow() {
-  // Create the browser window.
+const createWindow = () => {
   mainWindow = new BrowserWindow({
     height: 600,
     width: 900
   });
 
   if (process.env.NODE_ENV === 'development') {
+    console.log('Loading development environment');
     mainWindow.loadURL('http://localhost:8080');
     mainWindow.webContents.openDevTools();
   } else {
-    mainWindow.loadFile(path.join(__dirname, 'index.html'));
+    console.log('Loading non-development environment');
+    mainWindow.loadURL(
+      url.format({
+        pathname: path.join(__dirname, 'index.html'),
+        protocol: 'file:',
+        slashes: true
+      })
+    );
   }
 
-  // Emitted when the window is closed.
   mainWindow.on('closed', () => {
-    // Dereference the window object, usually you would store windows
-    // in an array if your app supports multi windows, this is the time
-    // when you should delete the corresponding element.
     mainWindow = null;
   });
-}
+};
 
-// This method will be called when Electron has finished
-// initialization and is ready to create browser windows.
-// Some APIs can only be used after this event occurs.
 app.on('ready', createWindow);
 
-// Quit when all windows are closed.
 app.on('window-all-closed', () => {
-  // On OS X it is common for applications and their menu bar
-  // to stay active until the user quits explicitly with Cmd + Q
   if (process.platform !== 'darwin') {
     app.quit();
   }
 });
 
 app.on('activate', () => {
-  // On OS X it"s common to re-create a window in the app when the
-  // dock icon is clicked and there are no other windows open.
   if (mainWindow === null) {
     createWindow();
   }
 });
-
-// In this file you can include the rest of your app"s specific main process
-// code. You can also put them in separate files and require them here.

webpack.common.js

@@ -9,7 +9,7 @@ module.exports = {
   },
   output: {
     path: path.resolve(__dirname, 'dist'),
-    publicPath: '/'
+    filename: '[hash].js'
   },
   plugins: [
     new ForkTsCheckerWebpackPlugin(),

webpack.main.js

@@ -2,7 +2,7 @@ const path = require('path');
 const webpack = require('webpack');
 
 module.exports = {
-  mode: 'development',
+  mode: 'production',
   devtool: 'inline-source-map',
   target: 'electron-main',
   entry: {
@@ -19,5 +19,14 @@ module.exports = {
         loader: 'ts-loader'
       }
     ]
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
+    })
+  ],
+  node: {
+    __dirname: false,
+    __filename: false
   }
 };

webpack.renderer.prod.js

@@ -0,0 +1,37 @@
+const path = require('path');
+const merge = require('webpack-merge');
+const webpack = require('webpack');
+const common = require('./webpack.common.js');
+const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
+const WorkboxPlugin = require('workbox-webpack-plugin');
+
+module.exports = merge(common, {
+  mode: 'production',
+  target: 'electron-renderer',
+  devtool: 'source-map',
+  output: {
+    filename: '[name].[chunkhash].js'
+  },
+  optimization: {
+    minimize: true,
+    nodeEnv: 'production',
+    concatenateModules: true,
+    splitChunks: {
+      cacheGroups: {
+        vendor: {
+          chunks: 'initial',
+          name: 'vendors',
+          test: /[\\/]node_modules[\\/]/,
+          enforce: true
+        }
+      }
+    },
+    runtimeChunk: true
+  },
+  plugins: [
+    new WorkboxPlugin.GenerateSW({
+      clientsClaim: true,
+      skipWaiting: true
+    })
+  ]
+});