chore: sync with verdaccio master

tools/.eslintrc

@@ -0,0 +1,14 @@
+{
+  "rules": {
+    "comma-dangle": 0,
+    "no-console": [
+      2,
+      {
+        "allow": [
+          "warn",
+          "log"
+        ]
+      }
+    ]
+  }
+}

tools/dev.server.js

@@ -1,23 +1,21 @@
-import path from "path";
-import webpack from "webpack";
-import WebpackDevServer from "webpack-dev-server";
-import config from "./webpack.dev.config.babel";
-import ora from "ora";
-
-const DIST_PATH = path.resolve(__dirname, "../static/");
+import webpack from 'webpack';
+import WebpackDevServer from 'webpack-dev-server';
+import config from './webpack.dev.config.babel';
+import ora from 'ora';
+import env from '../src/config/env';
 
 const compiler = webpack(config);
-const spinner = ora("Compiler is running...").start();
-compiler.hooks.done.tap("Verdaccio Dev Server", () => {
+const spinner = ora('Compiler is running...').start();
+compiler.hooks.done.tap('Verdaccio Dev Server', () => {
   if (!global.rebuild) {
     spinner.stop();
-    console.log("Dev Server Listening at http://localhost:4872/");
+    console.log('Dev Server Listening at http://localhost:4872/');
     global.rebuild = true;
   }
 });
 
 new WebpackDevServer(compiler, {
-  contentBase: `${DIST_PATH}`,
+  contentBase: `${env.DIST_PATH}`,
   publicPath: config.output.publicPath,
   hot: true,
   historyApiFallback: true,
@@ -30,19 +28,13 @@ new WebpackDevServer(compiler, {
     hash: true,
     timings: true,
     chunks: true,
-    chunkModules: false
+    chunkModules: false,
   },
-  proxy: [
-    {
-      context: [
-        "/-/verdaccio/logo",
-        "/-/verdaccio/packages",
-        "/-/static/logo.png"
-      ],
-      target: "http://localhost:4873"
-    }
-  ]
-}).listen(4872, "localhost", function(err) {
+  proxy: [{
+      context: ['/-/verdaccio/logo', '/-/verdaccio/packages', '/-/static/logo.png'],
+      target: 'http://localhost:4873',
+  }],
+}).listen(4872, 'localhost', function(err) {
   if (err) {
     return console.log(err);
   }

tools/getPackageJson.js

@@ -0,0 +1,25 @@
+import fs from 'fs';
+import path from 'path';
+
+/**
+ * A module to get package informations from package.json
+ * @module getPackageJson
+ * @param {...string} keys from package.json if no arguments passed it returns package.json content as object
+ * @returns {object} with given keys or content of package.json as object
+ */
+
+/**
+ * Returns package info
+ */
+const getPackageJson = function(...args) {
+  const packageJSON = JSON.parse(fs.readFileSync(path.join(__dirname, '../package.json')));
+  if (!args.length) {
+    return packageJSON;
+  }
+  return args.reduce((out, key) => {
+    out[key] = packageJSON[key];
+    return out;
+  }, {});
+};
+
+module.exports = getPackageJson;

tools/webpack.config.js

@@ -1,77 +1,74 @@
-const path = require("path");
-const StyleLintPlugin = require("stylelint-webpack-plugin");
-
-const SRC_ROOT = path.resolve(__dirname, "../src/");
-const APP_ROOT = path.resolve(__dirname, "../static/");
+const env = require('../src/config/env');
+const StyleLintPlugin = require('stylelint-webpack-plugin');
 
 module.exports = {
-  entry: `${SRC_ROOT}/index.js`,
+  entry: `${env.SRC_ROOT}/webui/src/index.js`,
 
   output: {
-    path: `${APP_ROOT}/static/`,
-    filename: "[name].[hash].js"
-    // publicPath: "ToReplaceByVerdaccio/-/static"
+    path: `${env.APP_ROOT}/static/`,
+    filename: '[name].[hash].js',
+    publicPath: 'ToReplaceByVerdaccio/-/static',
   },
 
   resolve: {
-    extensions: [".js", ".jsx"]
+    extensions: ['.js', '.jsx'],
   },
 
   plugins: [
     new StyleLintPlugin({
-      files: ["src/**/styles.js"],
+      files: ['src/webui/**/styles.js'],
       failOnError: false,
       emitErrors: true
-    })
+    }),
   ],
 
   optimization: {
     runtimeChunk: {
-      name: "manifest"
+      name: 'manifest',
     },
     splitChunks: {
       cacheGroups: {
         vendor: {
           test: /[\\/]node_modules[\\/]/,
-          name: "vendors",
+          name: 'vendors',
           priority: -20,
-          chunks: "all"
-        }
-      }
-    }
+          chunks: 'all',
+        },
+      },
+    },
   },
 
   module: {
     rules: [
-      // /* Pre loader */
-      // {
-      //   enforce: "pre",
-      //   test: /\.jsx?$/,
-      //   exclude: /node_modules/,
-      //   use: "eslint-loader"
-      // },
+      /* Pre loader */
+      {
+        enforce: 'pre',
+        test: /\.jsx?$/,
+        exclude: /node_modules/,
+        use: 'eslint-loader',
+      },
 
       /* Normal loader */
       {
         test: /\.jsx?$/,
         exclude: /node_modules/,
-        use: "babel-loader"
+        use: 'babel-loader',
       },
       {
         test: /\.(jpe?g|png|gif|svg)$/,
         use: [
           {
-            loader: "file-loader"
-          }
+            loader: 'file-loader'
+          },
         ]
       },
       {
         test: /\.(woff|woff2|eot|ttf|otf)$/,
-        loader: "url-loader",
+        loader: 'url-loader',
         options: {
-          name: "fonts/[name].[ext]",
-          limit: 50
-        }
+          name: 'fonts/[name].[ext]',
+          limit: 50,
+        },
       },
       {
         test: /\.scss$/,
@@ -83,17 +80,17 @@ module.exports = {
         test: /\.css$/,
         use: [
           {
-            loader: "style-loader"
+            loader: 'style-loader',
           },
           {
-            loader: "css-loader"
-          }
-        ]
-      }
-    ]
+            loader: 'css-loader',
+          },
+        ],
+      },
+    ],
   },
 
   stats: {
-    children: false
-  }
+    children: false,
+  },
 };

tools/webpack.dev.config.babel.js

@@ -1,55 +1,55 @@
-const path = require("path");
-const webpack = require("webpack");
-const HTMLWebpackPlugin = require("html-webpack-plugin");
-const FriendlyErrorsPlugin = require("friendly-errors-webpack-plugin");
-const baseConfig = require("./webpack.config");
-const StyleLintPlugin = require("stylelint-webpack-plugin");
-
-const SRC_ROOT = path.resolve(__dirname, "../src/");
+import webpack from 'webpack';
+import HTMLWebpackPlugin from 'html-webpack-plugin';
+import FriendlyErrorsPlugin from 'friendly-errors-webpack-plugin';
+import baseConfig from './webpack.config';
+import env from '../src/config/env';
+import StyleLintPlugin from 'stylelint-webpack-plugin';
+import getPackageJson from './getPackageJson';
 
 export default {
   ...baseConfig,
 
-  mode: "development",
+  mode: 'development',
 
   entry: {
     main: [
-      "whatwg-fetch",
-      "react-hot-loader/patch",
-      "webpack-dev-server/client?http://localhost:4872",
-      "webpack/hot/only-dev-server",
-      `${SRC_ROOT}/index.js`
-    ]
+      'whatwg-fetch',
+      'react-hot-loader/patch',
+      'webpack-dev-server/client?http://localhost:4872',
+      'webpack/hot/only-dev-server',
+      `${env.SRC_ROOT}/webui/index.js`,
+    ],
   },
 
   output: {
     ...baseConfig.output,
-    publicPath: "/"
+    publicPath: '/',
   },
 
-  devtool: "cheap-module-eval-source-map",
+  devtool: 'cheap-module-eval-source-map',
 
   plugins: [
     new webpack.DefinePlugin({
-      __DEBUG__: true
+      __DEBUG__: true,
+      __APP_VERSION__: `"${getPackageJson('version')}"`,
     }),
     new HTMLWebpackPlugin({
-      title: "Verdaccio Dev UI",
-      scope: "",
-      logo: "https://verdaccio.org/img/logo/symbol/svg/verdaccio-tiny.svg",
-      filename: "index.html",
-      verdaccioURL: "//localhost:4873",
-      template: `${SRC_ROOT}/template/index.html`,
+      title: 'Verdaccio Dev UI',
+      scope: '',
+      logo: 'https://verdaccio.org/img/logo/symbol/svg/verdaccio-tiny.svg',
+      filename: 'index.html',
+      verdaccioURL: '//localhost:4873',
+      template: `${env.SRC_ROOT}/webui/template/index.html`,
       debug: true,
-      inject: true
+      inject: true,
     }),
     new webpack.HotModuleReplacementPlugin(),
     new webpack.NoEmitOnErrorsPlugin(),
     new FriendlyErrorsPlugin(),
     new StyleLintPlugin({
-      files: ["src/**/styles.js"],
+      files: ['src/webui/**/styles.js'],
       failOnError: false,
       emitErrors: false
-    })
-  ]
+    }),
+  ],
 };

tools/webpack.prod.config.babel.js

@@ -1,58 +1,76 @@
-const path = require("path");
-const webpack = require("webpack");
-const HTMLWebpackPlugin = require("html-webpack-plugin");
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-const UglifyJsWebpackPlugin = require("uglifyjs-webpack-plugin");
-const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
-const baseConfig = require("./webpack.config");
-const merge = require("webpack-merge");
-const _ = require("lodash");
-const SRC_ROOT = path.resolve(__dirname, "../src/");
+const webpack = require('webpack');
+const HTMLWebpackPlugin = require('html-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const UglifyJsWebpackPlugin = require('uglifyjs-webpack-plugin');
+const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+const baseConfig = require('./webpack.config');
+const env = require('../src/config/env');
+const _ = require('lodash');
+const merge = require('webpack-merge');
+const getPackageJson = require('./getPackageJson');
+
+const {
+  version,
+  name,
+  license,
+} = getPackageJson('version', 'name', 'license');
+
+const banner = `
+    Name: [name]
+    Generated on: ${Date.now()}
+    Package: ${name}
+    Version: v${version}
+    License: ${license}
+    `;
 
 const prodConf = {
-  mode: "production",
+  mode: 'production',
 
   entry: {
-    main: ["@babel/polyfill", "whatwg-fetch", `${SRC_ROOT}/index.js`]
+    main: ['babel-polyfill', 'whatwg-fetch', `${env.SRC_ROOT}/webui/index.js`],
   },
 
   module: {
-    rules: []
+    rules: [],
   },
 
   plugins: [
+    new webpack.DefinePlugin({
+      __DEBUG__: false,
+      'process.env.NODE_ENV': '"production"',
+      __APP_VERSION__: `"${version}"`,
+    }),
     new MiniCssExtractPlugin({
-      filename: "style.[contenthash].css"
+      filename: 'style.[contenthash].css',
     }),
     new HTMLWebpackPlugin({
-      title: "ToReplaceByTitle",
-      scope: "ToReplaceByScope",
-      filename: "index.html",
-      favicon: `${SRC_ROOT}/template/favicon.ico`,
-      verdaccioURL: "ToReplaceByVerdaccio",
-      template: `${SRC_ROOT}/template/index.html`,
+      title: 'ToReplaceByTitle',
+      scope: 'ToReplaceByScope',
+      logo: 'ToReplaceByLogo',
+      filename: 'index.html',
+      favicon: `${env.SRC_ROOT}/webui/template/favicon.ico`,
+      verdaccioURL: 'ToReplaceByVerdaccio',
+      template: `${env.SRC_ROOT}/webui/template/index.html`,
       debug: false,
-      inject: true
-    })
+      inject: true,
+    }),
+    new webpack.BannerPlugin(banner),
   ],
 
   optimization: {
     minimizer: [
       new UglifyJsWebpackPlugin({
-        sourceMap: true
+        sourceMap: true,
       }),
-      new OptimizeCSSAssetsPlugin({})
-    ]
-  }
+      new OptimizeCSSAssetsPlugin({}),
+    ],
+  },
 };
 
 prodConf.module.rules = baseConfig.module.rules
-  .filter(
-    loader =>
-      Array.isArray(loader.use) &&
-      loader.use.find(v => /css/.test(v.loader.split("-")[0]))
-  )
-  .forEach(loader => {
+  .filter((loader) =>
+    Array.isArray(loader.use) && loader.use.find((v) => /css/.test(v.loader.split('-')[0]))
+  ).forEach((loader) => {
     loader.use = [MiniCssExtractPlugin.loader].concat(_.tail(loader.use));
   });