From 1291130f9e976a8b9f1fbbbe4cf256d1974d541a Mon Sep 17 00:00:00 2001
From: Nicolas Gotchac <ngotchac@gmail.com>
Date: Thu, 24 Nov 2016 02:28:33 +0100
Subject: [PATCH] Simpler Webpack config : create HTML files for dapps

---
 js/package.json                             | 199 ++++++++++----------
 js/src/dapps/basiccoin.html                 |  17 --
 js/src/dapps/basiccoin.js                   |   1 -
 js/src/dapps/dappreg.html                   |  17 --
 js/src/dapps/dappreg.js                     |   1 -
 js/src/dapps/githubhint.js                  |   1 -
 js/src/dapps/{githubhint.html => index.ejs} |   8 +-
 js/src/dapps/localtx.html                   |  17 --
 js/src/dapps/localtx.js                     |   1 -
 js/src/dapps/registry.html                  |  17 --
 js/src/dapps/registry.js                    |   1 -
 js/src/dapps/signaturereg.html              |  17 --
 js/src/dapps/signaturereg.js                |   1 -
 js/src/dapps/tokenreg.html                  |  17 --
 js/src/dapps/tokenreg.js                    |   1 -
 js/src/{index.html => index.ejs}            |   5 +-
 js/src/index.js                             |   1 -
 js/webpack.config.js                        |  62 ++++--
 18 files changed, 153 insertions(+), 231 deletions(-)
 delete mode 100644 js/src/dapps/basiccoin.html
 delete mode 100644 js/src/dapps/dappreg.html
 rename js/src/dapps/{githubhint.html => index.ejs} (59%)
 delete mode 100644 js/src/dapps/localtx.html
 delete mode 100644 js/src/dapps/registry.html
 delete mode 100644 js/src/dapps/signaturereg.html
 delete mode 100644 js/src/dapps/tokenreg.html
 rename js/src/{index.html => index.ejs} (67%)

diff --git a/js/package.json b/js/package.json
index 490ec7bb1..43aabcc52 100644
--- a/js/package.json
+++ b/js/package.json
@@ -47,127 +47,128 @@
     "prepush": "npm run lint:cached"
   },
   "devDependencies": {
-    "babel-cli": "^6.10.1",
-    "babel-core": "^6.10.4",
-    "babel-eslint": "^7.1.0",
-    "babel-loader": "^6.2.3",
-    "babel-plugin-lodash": "^3.2.2",
-    "babel-plugin-transform-class-properties": "^6.11.5",
-    "babel-plugin-transform-decorators-legacy": "^1.3.4",
-    "babel-plugin-transform-react-remove-prop-types": "^0.2.9",
-    "babel-plugin-transform-runtime": "^6.9.0",
-    "babel-polyfill": "^6.13.0",
-    "babel-preset-es2015": "^6.9.0",
-    "babel-preset-es2015-rollup": "^1.1.1",
-    "babel-preset-es2016": "^6.11.3",
-    "babel-preset-es2017": "^6.14.0",
-    "babel-preset-react": "^6.5.0",
-    "babel-preset-stage-0": "^6.5.0",
+    "babel-cli": "~6.10.1",
+    "babel-core": "~6.10.4",
+    "babel-eslint": "~7.1.0",
+    "babel-loader": "~6.2.3",
+    "babel-plugin-lodash": "~3.2.2",
+    "babel-plugin-transform-class-properties": "~6.11.5",
+    "babel-plugin-transform-decorators-legacy": "~1.3.4",
+    "babel-plugin-transform-react-remove-prop-types": "~0.2.9",
+    "babel-plugin-transform-runtime": "~6.9.0",
+    "babel-polyfill": "~6.13.0",
+    "babel-preset-es2015": "~6.9.0",
+    "babel-preset-es2015-rollup": "~1.1.1",
+    "babel-preset-es2016": "~6.11.3",
+    "babel-preset-es2017": "~6.14.0",
+    "babel-preset-react": "~6.5.0",
+    "babel-preset-stage-0": "~6.5.0",
     "babel-register": "6.9.0",
-    "babel-runtime": "^6.9.2",
-    "chai": "^3.5.0",
+    "babel-runtime": "~6.9.2",
+    "chai": "~3.5.0",
     "chai-enzyme": "0.4.2",
     "cheerio": "0.20.0",
-    "copy-webpack-plugin": "^4.0.0",
-    "core-js": "^2.4.1",
-    "coveralls": "^2.11.11",
-    "css-loader": "^0.23.1",
+    "copy-webpack-plugin": "~4.0.0",
+    "core-js": "~2.4.1",
+    "coveralls": "~2.11.11",
+    "css-loader": "~0.23.1",
     "enzyme": "2.3.0",
-    "eslint": "^3.1.0",
-    "eslint-config-semistandard": "^6.0.2",
-    "eslint-config-standard": "^5.3.5",
-    "eslint-config-standard-react": "^3.0.0",
-    "eslint-plugin-promise": "^2.0.0",
-    "eslint-plugin-react": "^5.1.1",
-    "eslint-plugin-standard": "^2.0.0",
+    "eslint": "~3.1.0",
+    "eslint-config-semistandard": "~6.0.2",
+    "eslint-config-standard": "~5.3.5",
+    "eslint-config-standard-react": "~3.0.0",
+    "eslint-plugin-promise": "~2.0.0",
+    "eslint-plugin-react": "~5.1.1",
+    "eslint-plugin-standard": "~2.0.0",
     "extract-loader": "0.0.2",
-    "extract-text-webpack-plugin": "^1.0.1",
-    "file-loader": "^0.8.5",
-    "fs-extra": "^0.30.0",
-    "happypack": "^2.2.1",
-    "history": "^2.0.0",
-    "html-loader": "^0.4.4",
-    "husky": "^0.11.9",
+    "extract-text-webpack-plugin": "~1.0.1",
+    "file-loader": "~0.8.5",
+    "fs-extra": "~0.30.0",
+    "happypack": "~2.2.1",
+    "history": "~2.0.0",
+    "html-loader": "~0.4.4",
+    "html-webpack-plugin": "~2.24.1",
+    "husky": "~0.11.9",
     "ignore-styles": "2.0.0",
-    "image-webpack-loader": "^1.8.0",
-    "istanbul": "^1.0.0-alpha.2",
+    "image-webpack-loader": "~1.8.0",
+    "istanbul": "~1.0.0-alpha.2",
     "jsdom": "9.2.1",
-    "json-loader": "^0.5.4",
-    "mocha": "^3.0.0-1",
+    "json-loader": "~0.5.4",
+    "mocha": "~3.0.0-1",
     "mock-local-storage": "1.0.2",
-    "mock-socket": "^3.0.1",
-    "nock": "^8.0.0",
-    "postcss-import": "^8.1.2",
-    "postcss-loader": "^0.8.1",
-    "postcss-nested": "^1.0.0",
-    "postcss-simple-vars": "^3.0.0",
-    "raw-loader": "^0.5.1",
+    "mock-socket": "~3.0.1",
+    "nock": "~8.0.0",
+    "postcss-import": "~8.1.2",
+    "postcss-loader": "~0.8.1",
+    "postcss-nested": "~1.0.0",
+    "postcss-simple-vars": "~3.0.0",
+    "raw-loader": "~0.5.1",
     "react-addons-perf": "~15.3.2",
     "react-addons-test-utils": "~15.3.2",
-    "react-copy-to-clipboard": "^4.2.3",
+    "react-copy-to-clipboard": "~4.2.3",
     "react-dom": "~15.3.2",
     "react-hot-loader": "~1.3.0",
-    "rucksack-css": "^0.8.6",
-    "sinon": "^1.17.4",
-    "sinon-as-promised": "^4.0.2",
-    "sinon-chai": "^2.8.0",
-    "style-loader": "^0.13.0",
-    "url-loader": "^0.5.7",
-    "webpack": "^1.13.2",
-    "webpack-dev-server": "^1.15.2",
+    "rucksack-css": "~0.8.6",
+    "sinon": "~1.17.4",
+    "sinon-as-promised": "~4.0.2",
+    "sinon-chai": "~2.8.0",
+    "style-loader": "~0.13.0",
+    "url-loader": "~0.5.7",
+    "webpack": "~1.13.2",
+    "webpack-dev-server": "~1.15.2",
     "webpack-error-notification": "0.1.6",
     "webpack-hot-middleware": "~2.13.2",
-    "websocket": "^1.0.23"
+    "websocket": "~1.0.23"
   },
   "dependencies": {
-    "bignumber.js": "^2.3.0",
+    "bignumber.js": "~2.3.0",
     "blockies": "0.0.2",
-    "brace": "^0.9.0",
-    "bytes": "^2.4.0",
-    "chart.js": "^2.3.0",
-    "es6-error": "^4.0.0",
-    "es6-promise": "^3.2.1",
-    "ethereumjs-tx": "^1.1.2",
-    "file-saver": "^1.3.3",
-    "format-json": "^1.0.3",
-    "format-number": "^2.0.1",
-    "geopattern": "^1.2.3",
-    "isomorphic-fetch": "^2.2.1",
-    "js-sha3": "^0.5.2",
-    "lodash": "^4.11.1",
-    "marked": "^0.3.6",
+    "brace": "~0.9.0",
+    "bytes": "~2.4.0",
+    "chart.js": "~2.3.0",
+    "es6-error": "~4.0.0",
+    "es6-promise": "~3.2.1",
+    "ethereumjs-tx": "~1.1.2",
+    "file-saver": "~1.3.3",
+    "format-json": "~1.0.3",
+    "format-number": "~2.0.1",
+    "geopattern": "~1.2.3",
+    "isomorphic-fetch": "~2.2.1",
+    "js-sha3": "~0.5.2",
+    "lodash": "~4.11.1",
+    "marked": "~0.3.6",
     "material-ui": "0.16.1",
-    "material-ui-chip-input": "^0.8.0",
-    "mobx": "^2.6.1",
-    "mobx-react": "^3.5.8",
-    "mobx-react-devtools": "^4.2.9",
-    "moment": "^2.14.1",
-    "phoneformat.js": "^1.0.3",
-    "qs": "^6.3.0",
+    "material-ui-chip-input": "~0.8.0",
+    "mobx": "~2.6.1",
+    "mobx-react": "~3.5.8",
+    "mobx-react-devtools": "~4.2.9",
+    "moment": "~2.14.1",
+    "phoneformat.js": "~1.0.3",
+    "qs": "~6.3.0",
     "react": "~15.3.2",
-    "react-ace": "^4.0.0",
+    "react-ace": "~4.0.0",
     "react-addons-css-transition-group": "~15.3.2",
-    "react-chartjs-2": "^1.5.0",
+    "react-chartjs-2": "~1.5.0",
     "react-dom": "~15.3.2",
-    "react-dropzone": "^3.7.3",
-    "react-redux": "^4.4.5",
-    "react-router": "^2.6.1",
-    "react-router-redux": "^4.0.5",
+    "react-dropzone": "~3.7.3",
+    "react-redux": "~4.4.5",
+    "react-router": "~2.6.1",
+    "react-router-redux": "~4.0.5",
     "react-tap-event-plugin": "~1.0.0",
-    "react-tooltip": "^2.0.3",
-    "recharts": "^0.15.2",
-    "redux": "^3.5.2",
-    "redux-actions": "^0.10.1",
-    "redux-thunk": "^2.1.0",
-    "rlp": "^2.0.0",
-    "scryptsy": "^2.0.0",
+    "react-tooltip": "~2.0.3",
+    "recharts": "~0.15.2",
+    "redux": "~3.5.2",
+    "redux-actions": "~0.10.1",
+    "redux-thunk": "~2.1.0",
+    "rlp": "~2.0.0",
+    "scryptsy": "~2.0.0",
     "solc": "ngotchac/solc-js",
-    "store": "^1.3.20",
-    "utf8": "^2.1.1",
-    "valid-url": "^1.0.9",
-    "validator": "^5.7.0",
-    "web3": "^0.17.0-beta",
-    "whatwg-fetch": "^1.0.0",
-    "worker-loader": "^0.7.1"
+    "store": "~1.3.20",
+    "utf8": "~2.1.1",
+    "valid-url": "~1.0.9",
+    "validator": "~5.7.0",
+    "web3": "~0.17.0-beta",
+    "whatwg-fetch": "~1.0.0",
+    "worker-loader": "~0.7.1"
   }
 }
diff --git a/js/src/dapps/basiccoin.html b/js/src/dapps/basiccoin.html
deleted file mode 100644
index 52bc8bc57..000000000
--- a/js/src/dapps/basiccoin.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Basic Token Deployment</title>
-  </head>
-  <body>
-    <div id="container"></div>
-    <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="/parity-utils/parity.js"></script>
-    <script src="basiccoin.js"></script>
-  </body>
-</html>
diff --git a/js/src/dapps/basiccoin.js b/js/src/dapps/basiccoin.js
index e02990d14..a64afa0b9 100644
--- a/js/src/dapps/basiccoin.js
+++ b/js/src/dapps/basiccoin.js
@@ -32,7 +32,6 @@ const routerHistory = useRouterHistory(createHashHistory)({});
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './basiccoin.html';
 
 ReactDOM.render(
   <Router history={ routerHistory }>
diff --git a/js/src/dapps/dappreg.html b/js/src/dapps/dappreg.html
deleted file mode 100644
index 89c95c472..000000000
--- a/js/src/dapps/dappreg.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Dapp Registry</title>
-  </head>
-  <body>
-    <div id="container"></div>
-    <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="/parity-utils/parity.js"></script>
-    <script src="dappreg.js"></script>
-  </body>
-</html>
diff --git a/js/src/dapps/dappreg.js b/js/src/dapps/dappreg.js
index 243576a34..8ed9724bc 100644
--- a/js/src/dapps/dappreg.js
+++ b/js/src/dapps/dappreg.js
@@ -27,7 +27,6 @@ import Application from './dappreg/Application';
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './dappreg.html';
 
 ReactDOM.render(
   <Application />,
diff --git a/js/src/dapps/githubhint.js b/js/src/dapps/githubhint.js
index b73702990..ab807a44b 100644
--- a/js/src/dapps/githubhint.js
+++ b/js/src/dapps/githubhint.js
@@ -25,7 +25,6 @@ import Application from './githubhint/Application';
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './githubhint.html';
 
 ReactDOM.render(
   <Application />,
diff --git a/js/src/dapps/githubhint.html b/js/src/dapps/index.ejs
similarity index 59%
rename from js/src/dapps/githubhint.html
rename to js/src/dapps/index.ejs
index 746c7f466..13d70473f 100644
--- a/js/src/dapps/githubhint.html
+++ b/js/src/dapps/index.ejs
@@ -4,13 +4,13 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>GitHub Hint</title>
+    <title><%= htmlWebpackPlugin.options.title %></title>
   </head>
   <body>
     <div id="container"></div>
     <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="githubhint.js"></script>
+    <% if (!htmlWebpackPlugin.options.secure) { %>
+      <script src="/parity-utils/parity.js"></script>
+    <% } %>
   </body>
 </html>
diff --git a/js/src/dapps/localtx.html b/js/src/dapps/localtx.html
deleted file mode 100644
index d1e6fed05..000000000
--- a/js/src/dapps/localtx.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Local transactions Viewer</title>
-  </head>
-  <body>
-    <div id="container"></div>
-    <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="/parity-utils/parity.js"></script>
-    <script src="localtx.js"></script>
-  </body>
-</html>
diff --git a/js/src/dapps/localtx.js b/js/src/dapps/localtx.js
index 98561f33f..3e848ede9 100644
--- a/js/src/dapps/localtx.js
+++ b/js/src/dapps/localtx.js
@@ -25,7 +25,6 @@ import Application from './localtx/Application';
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './localtx.html';
 
 ReactDOM.render(
   <Application />,
diff --git a/js/src/dapps/registry.html b/js/src/dapps/registry.html
deleted file mode 100644
index ab399d1e3..000000000
--- a/js/src/dapps/registry.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Token Registry</title>
-  </head>
-  <body>
-    <div id="container"></div>
-    <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="/parity-utils/parity.js"></script>
-    <script src="registry.js"></script>
-  </body>
-</html>
diff --git a/js/src/dapps/registry.js b/js/src/dapps/registry.js
index ebcff155a..d132da3d8 100644
--- a/js/src/dapps/registry.js
+++ b/js/src/dapps/registry.js
@@ -27,7 +27,6 @@ import Container from './registry/Container';
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './registry.html';
 
 ReactDOM.render(
   <Provider store={ store }>
diff --git a/js/src/dapps/signaturereg.html b/js/src/dapps/signaturereg.html
deleted file mode 100644
index d050fe803..000000000
--- a/js/src/dapps/signaturereg.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Method Signature Registry</title>
-  </head>
-  <body>
-    <div id="container"></div>
-    <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="/parity-utils/parity.js"></script>
-    <script src="signaturereg.js"></script>
-  </body>
-</html>
diff --git a/js/src/dapps/signaturereg.js b/js/src/dapps/signaturereg.js
index 72ddd0ca7..d0d0cd423 100644
--- a/js/src/dapps/signaturereg.js
+++ b/js/src/dapps/signaturereg.js
@@ -25,7 +25,6 @@ import Application from './signaturereg/Application';
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './signaturereg.html';
 
 ReactDOM.render(
   <Application />,
diff --git a/js/src/dapps/tokenreg.html b/js/src/dapps/tokenreg.html
deleted file mode 100644
index d16d4082c..000000000
--- a/js/src/dapps/tokenreg.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Token Registry</title>
-  </head>
-  <body>
-    <div id="container"></div>
-    <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="/parity-utils/parity.js"></script>
-    <script src="tokenreg.js"></script>
-  </body>
-</html>
diff --git a/js/src/dapps/tokenreg.js b/js/src/dapps/tokenreg.js
index 8ca70e114..5e940ab08 100644
--- a/js/src/dapps/tokenreg.js
+++ b/js/src/dapps/tokenreg.js
@@ -27,7 +27,6 @@ import Container from './tokenreg/Container';
 import '../../assets/fonts/Roboto/font.css';
 import '../../assets/fonts/RobotoMono/font.css';
 import './style.css';
-import './tokenreg.html';
 
 ReactDOM.render(
   (
diff --git a/js/src/index.html b/js/src/index.ejs
similarity index 67%
rename from js/src/index.html
rename to js/src/index.ejs
index 780013432..8428e39ad 100644
--- a/js/src/index.html
+++ b/js/src/index.ejs
@@ -4,8 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <link rel="icon" href="/parity-logo-black-no-text.png" type="image/png">
-    <title>Parity</title>
+    <title><%= htmlWebpackPlugin.options.title %></title>
     <style>
       html, body, #container {
         height: 100%;
@@ -15,7 +14,5 @@
   <body>
     <div id="container"></div>
     <script src="vendor.js"></script>
-    <script src="commons.js"></script>
-    <script src="index.js"></script>
   </body>
 </html>
diff --git a/js/src/index.js b/js/src/index.js
index 0e0433c1e..d0251e28c 100644
--- a/js/src/index.js
+++ b/js/src/index.js
@@ -42,7 +42,6 @@ import '../assets/fonts/Roboto/font.css';
 import '../assets/fonts/RobotoMono/font.css';
 
 import styles from './reset.css';
-import './index.html';
 
 injectTapEventPlugin();
 
diff --git a/js/webpack.config.js b/js/webpack.config.js
index f51a1457d..68c1467d8 100644
--- a/js/webpack.config.js
+++ b/js/webpack.config.js
@@ -24,39 +24,54 @@ const rucksack = require('rucksack-css');
 const webpack = require('webpack');
 const WebpackErrorNotificationPlugin = require('webpack-error-notification');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
 
 const ENV = process.env.NODE_ENV || 'development';
 const isProd = ENV === 'production';
 const DEST = process.env.BUILD_DEST || '.build';
 
+const FAVICON = path.resolve(__dirname, 'assets/images/parity-logo-black-no-text.png');
+
+const DAPPS = [
+  { name: 'basiccoin', entry: './dapps/basiccoin.js', title: 'Basic Token Deployment' },
+  { name: 'dappreg', entry: './dapps/dappreg.js', title: 'Dapp Registry' },
+  { name: 'githubhint', entry: './dapps/githubhint.js', title: 'GitHub Hint', secure: true },
+  { name: 'localtx', entry: './dapps/localtx.js', title: 'Local transactions Viewer', secure: true },
+  { name: 'registry', entry: './dapps/registry.js', title: 'Registry' },
+  { name: 'signaturereg', entry: './dapps/signaturereg.js', title: 'Method Signature Registry' },
+  { name: 'tokenreg', entry: './dapps/tokenreg.js', title: 'Token Registry' }
+];
+
+// dapps
+const entry = DAPPS.reduce((_entry, dapp) => {
+  _entry[dapp.name] = dapp.entry;
+  return _entry;
+}, {});
+
+// main UI
+entry.index = './index.js';
+
 module.exports = {
   debug: !isProd,
   cache: !isProd,
   devtool: isProd ? '#eval' : '#cheap-module-eval-source-map',
   context: path.join(__dirname, './src'),
-  entry: {
-    // dapps
-    'basiccoin': ['./dapps/basiccoin.js'],
-    'dappreg': ['./dapps/dappreg.js'],
-    'githubhint': ['./dapps/githubhint.js'],
-    'registry': ['./dapps/registry.js'],
-    'signaturereg': ['./dapps/signaturereg.js'],
-    'localtx': ['./dapps/localtx.js'],
-    'tokenreg': ['./dapps/tokenreg.js'],
-    // app
-    'index': ['./index.js']
-  },
+  entry: entry,
   output: {
     path: path.join(__dirname, DEST),
-    filename: '[name].js'
+    filename: '[name].[hash].js'
   },
   module: {
     loaders: [
       {
         test: /\.js$/,
-        exclude: /node_modules/,
+        exclude: [ /node_modules/, /vendor\.js$/ ],
         loaders: [ 'happypack/loader?id=js' ]
       },
+      {
+        test: /vendor\.js$/,
+        loaders: [ 'file?name=[name].[hash].[ext]' ]
+      },
       {
         test: /\.js$/,
         include: /node_modules\/material-ui-chip-input/,
@@ -157,9 +172,28 @@ module.exports = {
       new webpack.DllReferencePlugin({
         context: '.',
         manifest: require(`./${DEST}/vendor-manifest.json`)
+      }),
+
+      new HtmlWebpackPlugin({
+        title: 'Parity',
+        filename: 'index.html',
+        template: './index.ejs',
+        favicon: FAVICON,
+        chunks: [ 'commons', 'index' ]
       })
     ];
 
+    DAPPS.map((dapp) => {
+      return new HtmlWebpackPlugin({
+        title: dapp.title,
+        filename: dapp.name + '.html',
+        template: './dapps/index.ejs',
+        favicon: FAVICON,
+        secure: dapp.secure,
+        chunks: [ 'commons', dapp.name ]
+      });
+    }).forEach((plugin) => plugins.push(plugin));
+
     if (!isProd) {
       plugins.push(
         new webpack.optimize.CommonsChunkPlugin({