dashboard: integrate Flow, sketch message API (#15713)

* dashboard: minor design change

* dashboard: Flow integration, message API

* dashboard: minor polishes, exclude misspell linter

1 files changed, 54 insertions, 16 deletions

diff --git a/dashboard/assets/webpack.config.js b/dashboard/assets/webpack.config.js
index 13f8c3fbc..cf92e6c97 100644
--- a/dashboard/assets/webpack.config.js
+++ b/dashboard/assets/webpack.config.js
@@ -14,23 +14,61 @@
 // You should have received a copy of the GNU Lesser General Public License
 // along with the go-ethereum library. If not, see <http://www.gnu.org/licenses/>.
 
+const webpack = require('webpack');
 const path = require('path');
 
 module.exports = {
-    entry:  './index.jsx',
-    output: {
-        path:     path.resolve(__dirname, 'public'),
-        filename: 'bundle.js',
-    },
-    module: {
-        loaders: [
-            {
-                test: /\.jsx$/, // regexp for JSX files
-                loader: 'babel-loader', // The babel configuration is in the package.json.
-                query: {
-                    presets: ['env', 'react', 'stage-0']
-                }
-            },
-        ],
-    },
+	resolve: {
+		extensions: ['.js', '.jsx'],
+	},
+	entry:  './index',
+	output: {
+		path:     path.resolve(__dirname, 'public'),
+		filename: 'bundle.js',
+	},
+	plugins: [
+		new webpack.optimize.UglifyJsPlugin({
+			comments: false,
+			mangle:   false,
+			beautify: true,
+		}),
+	],
+	module: {
+		rules: [
+			{
+				test:    /\.jsx$/, // regexp for JSX files
+				exclude: /node_modules/,
+				use:     [ // order: from bottom to top
+					{
+						loader:  'babel-loader',
+						options: {
+							plugins: [ // order: from top to bottom
+								// 'transform-decorators-legacy', // @withStyles, @withTheme
+								'transform-class-properties', // static defaultProps
+								'transform-flow-strip-types',
+							],
+							presets: [ // order: from bottom to top
+								'env',
+								'react',
+								'stage-0',
+							],
+						},
+					},
+					// 'eslint-loader', // show errors not only in the editor, but also in the console
+				],
+			},
+			{
+				test: /font-awesome\.css$/,
+				use:  [
+					'style-loader',
+					'css-loader',
+					path.resolve(__dirname, './fa-only-woff-loader.js'),
+				],
+			},
+			{
+				test: /\.woff2?$/, // font-awesome icons
+				use:  'url-loader',
+			},
+		],
+	},
 };