diff --git a/package.json b/package.json
index e4ad1cda7..24ab26a12 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,8 @@
   "scripts": {
     "dev": "vue-cli-service serve",
     "build": "vue-cli-service build",
+    "build:testnet": "bash src/scripts/setup-subdir-config.sh testnet && vue-cli-service build",
+    "build:mainnet": "bash src/scripts/setup-subdir-config.sh mainnet && vue-cli-service build",
     "start": "node server.js",
     "lint": "vue-cli-service lint",
     "lint:css": "stylelint '**/*.vue' src/styles/main.scss --syntax scss",
diff --git a/src/router.js b/src/router.js
index 4e5cae93e..148dd5b31 100644
--- a/src/router.js
+++ b/src/router.js
@@ -20,6 +20,8 @@ import Vue from 'vue';
 import Router from 'vue-router';
 import PageAssembler from './views/PageAssembler.vue';
 import pages from './config/pages';
+import { publicPath } from '../vue.config';
+
 Vue.use(Router);
 
 const pagesRoutes = pages.map(page => ({
@@ -33,6 +35,7 @@ const pagesRoutes = pages.map(page => ({
 
 const routerConfig = {
 	mode: 'history',
+	base: publicPath,
 	scrollBehavior() {
 		return { x: 0, y: 0 };
 	},
diff --git a/src/scripts/mainnet/default.json b/src/scripts/mainnet/default.json
new file mode 100644
index 000000000..0368352e9
--- /dev/null
+++ b/src/scripts/mainnet/default.json
@@ -0,0 +1,34 @@
+{
+	"apiNodePort": 3001,
+	"endpoints": {
+		"marketData": "https://min-api.cryptocompare.com/",
+		"statisticsService": "https://symbol.services"
+	},
+	"networkConfig": {
+		"namespaceName": "symbol.xym",
+		"mosaicId": "6BED913FA20223F8",
+		"namespaceId": "E74B99BA41F4AFEE",
+		"divisibility": "6",
+		"networkIdentifier": 104
+	},
+	"footer": {
+		"link": [
+			{
+				"href": "https://github.com/symbol",
+				"text": "Github",
+				"icon": "IconGithub"
+			},
+			{
+				"href": "https://discord.com/invite/xymcity",
+				"text": "Join Discord",
+				"icon": "IconDiscord"
+			},
+			{
+				"href": "https://testnet.symbol.tools/",
+				"text": "Faucet",
+				"icon": "IconHomeCurrencyUsd"
+			}
+		]
+	}
+}
+
diff --git a/src/scripts/mainnet/vue.config.js b/src/scripts/mainnet/vue.config.js
new file mode 100644
index 000000000..eff14619d
--- /dev/null
+++ b/src/scripts/mainnet/vue.config.js
@@ -0,0 +1,25 @@
+// Read config files that may not exist.
+
+module.exports = {
+	// base url
+	publicPath: '/mainnet/',
+	// output dir
+	outputDir: './www',
+	// eslint-loader check
+	lintOnSave: true,
+	// webpack-dev-server
+	devServer: {
+		host: '0.0.0.0',
+		port: 8080,
+		before: app => {
+		}
+	},
+	css: {
+		// modules: true,
+		loaderOptions: {
+			sass: {
+				prependData: `@import "~@/styles/variables.scss";`
+			}
+		}
+	}
+};
diff --git a/src/scripts/setup-subdir-config.sh b/src/scripts/setup-subdir-config.sh
new file mode 100644
index 000000000..7f7c98d34
--- /dev/null
+++ b/src/scripts/setup-subdir-config.sh
@@ -0,0 +1,20 @@
+#!/bin/bash
+
+set -e
+
+if [[ ! ("$#" == 1) ]]; then
+    echo 'Please provide network type. eg: setup-subdir-config.sh testnet'
+    exit 1
+fi
+
+NETWORK="$1"
+
+DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" >/dev/null 2>&1 && pwd )"
+
+echo "Copying ${NETWORK} config"
+
+cp ${DIR}/${NETWORK}/default.json ${DIR}/../config/default.json
+cp ${DIR}/${NETWORK}/vue.config.js ${DIR}/../../vue.config.js
+
+echo "copied!"
+
diff --git a/src/scripts/testnet/default.json b/src/scripts/testnet/default.json
new file mode 100644
index 000000000..be03ec7ad
--- /dev/null
+++ b/src/scripts/testnet/default.json
@@ -0,0 +1,34 @@
+{
+	"apiNodePort": 3001,
+	"endpoints": {
+		"marketData": "https://min-api.cryptocompare.com/",
+		"statisticsService": "https://testnet.symbol.services"
+	},
+	"networkConfig": {
+		"namespaceName": "symbol.xym",
+		"mosaicId": "091F837E059AE13C",
+		"namespaceId": "E74B99BA41F4AFEE",
+		"divisibility": "6",
+		"networkIdentifier": 152
+	},
+	"footer": {
+		"link": [
+			{
+				"href": "https://github.com/symbol",
+				"text": "Github",
+				"icon": "IconGithub"
+			},
+			{
+				"href": "https://discord.com/invite/xymcity",
+				"text": "Join Discord",
+				"icon": "IconDiscord"
+			},
+			{
+				"href": "https://testnet.symbol.tools/",
+				"text": "Faucet",
+				"icon": "IconHomeCurrencyUsd"
+			}
+		]
+	}
+}
+
diff --git a/src/scripts/testnet/vue.config.js b/src/scripts/testnet/vue.config.js
new file mode 100644
index 000000000..b7ad5eb6b
--- /dev/null
+++ b/src/scripts/testnet/vue.config.js
@@ -0,0 +1,25 @@
+// Read config files that may not exist.
+
+module.exports = {
+	// base url
+	publicPath: '/testnet/',
+	// output dir
+	outputDir: './www',
+	// eslint-loader check
+	lintOnSave: true,
+	// webpack-dev-server
+	devServer: {
+		host: '0.0.0.0',
+		port: 8080,
+		before: app => {
+		}
+	},
+	css: {
+		// modules: true,
+		loaderOptions: {
+			sass: {
+				prependData: `@import "~@/styles/variables.scss";`
+			}
+		}
+	}
+};