Add Webpack

.gitignore

@@ -2,4 +2,6 @@
 build
 out
 .idea
-.gradle
+.gradle
+src/main/resources/static/dist
+node_modules

README.md

@@ -74,3 +74,12 @@ Getblock
 Exit or Quit
 
 Input any one of then, you will get more tips.
+
+## Build webpack
+
+Building the frontend requires [nodejs](https://nodejs.org/en/) and [yarn](https://yarnpkg.com/en/)
+
+```
+> yarn install
+> yarn build:dev
+```

package.json

@@ -0,0 +1,29 @@
+{
+  "name": "wallet-cli",
+  "version": "0.1",
+  "description": "Tron Network Wallet",
+  "main": "index.js",
+  "repository": "git@github.com:tronprotocol/wallet-cli.git",
+  "author": "Tron",
+  "license": "MIT",
+  "dependencies": {
+    "babel-loader": "^7.1.4",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-latest": "^6.24.1",
+    "cross-env": "^5.1.4",
+    "css-loader": "^0.28.11",
+    "file-loader": "^1.1.11",
+    "html-loader": "^0.5.5",
+    "sass-loader": "^6.0.7",
+    "style-loader": "^0.20.3",
+    "url-loader": "^1.0.1",
+    "webpack": "^4.2.0",
+    "webpack-cli": "^2.0.13",
+    "webpack-config-utils": "^2.3.0"
+  },
+  "scripts": {
+    "build:dev": "cross-env NODE_ENV=development webpack",
+    "build:prod": "cross-env NODE_ENV=production webpack"
+  }
+}

src/web/app.js

@@ -0,0 +1 @@
+// Entry Point

webpack.config.js

@@ -0,0 +1,82 @@
+const path = require("path");
+const packageJson = require('./package.json');
+const {getIfUtils, removeEmpty} = require('webpack-config-utils');
+const {ifProduction} = getIfUtils(process.env.NODE_ENV);
+
+module.exports = {
+  mode: process.env.NODE_ENV,
+  entry: {
+    app: path.resolve(__dirname, 'src/web/app.js'),
+  },
+  output: {
+    path: path.resolve(__dirname, 'src/main/resources/static/dist'),
+    filename: "[name].js",
+    publicPath: '/',
+  },
+  resolve: {
+    extensions: ['.js'],
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        include: [
+          path.resolve(__dirname, "src/web"),
+        ],
+        loader: 'babel-loader',
+        options: {
+          presets: ['latest'],
+          plugins: [
+            "transform-class-properties",
+            "transform-object-rest-spread",
+          ]
+        }
+      },
+      {
+        test: /\.html/,
+        use: 'html-loader'
+      },
+      {
+        test: /\.scss$/,
+        use: ["style-loader", "css-loader", "sass-loader"]
+      },
+      {
+        test: /\.css$/,
+        use: ["style-loader", "css-loader"]
+      },
+      {
+        test: /\.png$/,
+        use: "url-loader?limit=100000"
+      },
+      {
+        test: /\.jpg$/,
+        use: "file-loader"
+      },
+      {
+        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        use: "url-loader?limit=10000&minetype=application/font-woff"
+      },
+      {
+        test: /\.(gif|svg|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        use: "file-loader"
+      }
+    ]
+  },
+  devServer: {
+    contentBase: path.resolve(__dirname, "/assets/build"),
+    compress: true,
+    headers: {
+      'X-Content-Type-Options': 'nosniff',
+      'X-Frame-Options': 'DENY'
+    },
+    open: true,
+    overlay: {
+      warnings: true,
+      errors: true
+    },
+    port: 8181,
+    publicPath: '/assets/build/',
+    hot: true,
+    inline: true,
+  },
+};