Use HtmlWebpackPlugin to inject html during webpack build

.gitignore

@@ -5,8 +5,4 @@ Thumbs.db
 
 /dist
 /temp
-
-# ignore everything in 'app' folder what had been generated from 'src' folder
-/app/app.js
-/app/background.js
-/app/**/*.map
+/app

build/webpack.base.config.js

@@ -1,6 +1,8 @@
 const path = require("path");
+const jetpack = require("fs-jetpack");
 const nodeExternals = require("webpack-node-externals");
 const FriendlyErrorsWebpackPlugin = require("friendly-errors-webpack-plugin");
+const HtmlWebpackPlugin = require('html-webpack-plugin');
 
 const translateEnvToMode = (env) => {
   if (env === "production") {
@@ -9,6 +11,12 @@ const translateEnvToMode = (env) => {
   return "development";
 };
 
+const getAllHtmlFilesInSrcDir = () => {
+  const srcDir = jetpack.cwd('src');
+  return srcDir.find({ matching: '*.html', recursive: false })
+    .map(path => path.split('.').slice(0, -1).join('.'));
+};
+
 module.exports = env => {
   return {
     target: "electron-renderer",
@@ -37,8 +45,21 @@ module.exports = env => {
         }
       ]
     },
-    plugins: [
-      new FriendlyErrorsWebpackPlugin({ clearConsole: env === "development" })
-    ]
+    plugins: (() => {
+      const plugins = [
+        new FriendlyErrorsWebpackPlugin({ clearConsole: env === "development" }),
+      ];
+
+      getAllHtmlFilesInSrcDir().map(fileName => 
+        plugins.push(
+          new HtmlWebpackPlugin({
+            filename: `${fileName}.html`,
+            template: `src/${fileName}.html`,
+            chunks: [ fileName ]
+          })
+        )
+      )
+      return plugins;
+    })()
   };
 };