feat: help for core flags (#1141)

* feat: add core-flags to help

* chore: update line order

* fix: ignore help flag

* chore: converted ternary to arrow function

* chore: immediate call arrow

* chore: verbose variable names

* feat: add usage to commands

* chore: update syntax for export

* tests: remove output flags from child process

* tests: update multiarg help tests

* test: replace init arg to create

* tests: update string to be tested

* chore: update tests

* fix:  various tests are now working (#1168)

* fix:  various tests are now working

- changed from `bundle.js` to `main.js`
- applied merging strategy in the correct moment
- fixed some tests

* fix: merge config test

* chore: update cli-flags

* chore: add comment and remove info

* chore: update help

* chore: update help

* chore: fix code quality

* chore: update snapshots

Co-authored-by: Emanuele <my.burning@gmail.com>

Author: rishabh3112

lib/groups/help.js

@@ -3,17 +3,30 @@ const chalk = require('chalk');
 const commandLineUsage = require('command-line-usage');
 
 class HelpGroup {
-    outputHelp(command = null) {
-        if (command !== null) {
-            const commands = require('../utils/commands').info;
+    outputHelp(isCommand = true, subject) {
+        if (subject) {
+            const info = isCommand ? require('../utils/cli-flags').commands : require('../utils/cli-flags').core;
+            // Contains object with details about given subject
+            const options = info.find(commandOrFlag => {
+                if (isCommand) {
+                    return commandOrFlag.name == subject || commandOrFlag.alias == subject;
+                }
+                return commandOrFlag.name === subject.slice(2) || commandOrFlag.alias === subject.slice(1);
+            });
+
             const { bold, underline } = chalk.white;
             const header = head => bold(underline(head));
-
-            const options = commands.find(cmd => cmd.name === command || cmd.alias === command);
             const usage = chalk.keyword('orange')('webpack ' + options.usage);
             const description = options.description;
+            const link = options.link;
+
+            process.stdout.write(`${header('Usage')}: ${usage}\n`);
+            process.stdout.write(`${header('Description')}: ${description}\n`);
+
+            if (link) {
+                process.stdout.write(`${header('Documentation')}: ${link}\n`);
+            }
 
-            process.stdout.write(`${header('Usage')}: ${usage}\n${header('Description')}: ${description}\n`);
             if (options.flags) {
                 const flags = commandLineUsage({
                     header: 'Options',

lib/utils/cli-flags.js

@@ -112,66 +112,80 @@ module.exports = {
     core: [
         {
             name: 'entry',
+            usage: '--entry <path to entry file> e.g. ./src/main.js',
             type: String,
             defaultValue: null,
             defaultOption: true,
             group: BASIC_GROUP,
-            description: 'The entry point of your application',
+            description: 'The entry point of your application.',
+            link: 'https://webpack.js.org/concepts/#entry',
         },
         {
             name: 'config',
+            usage: '--config <path to webpack configuration file> e.g. ./webpack.config.js',
             alias: 'c',
             type: String,
             defaultValue: null,
             group: CONFIG_GROUP,
             description: 'Provide path to a webpack configuration file',
+            link: 'https://webpack.js.org/configuration/',
         },
         {
             name: 'merge',
+            usage: '--merge <path to configuration to be merged> e.g. ./webpack.config.js',
             alias: 'm',
             type: String,
             group: CONFIG_GROUP,
-            description: 'Merge a configuration file',
+            description: 'Merge a configuration file using webpack-merge',
+            link: 'https://github.com/survivejs/webpack-merge',
         },
         {
             name: 'progress',
+            usage: '--progress',
             type: Boolean,
             group: BASIC_GROUP,
             description: 'Print compilation progress during build',
         },
         {
             name: 'silent',
+            usage: '--silent',
             type: Boolean,
             group: DISPLAY_GROUP,
             description: 'Disable any output that webpack makes',
         },
         {
             name: 'help',
+            usage: '--help',
             type: Boolean,
             group: HELP_GROUP,
             description: 'Outputs list of supported flags',
         },
         {
             name: 'defaults',
+            usage: '--defaults',
             type: Boolean,
             group: BASIC_GROUP,
             description: 'Allow webpack to set defaults aggresively',
         },
         {
             name: 'output',
+            usage: '--output <path to output directory> e.g. ./dist/',
             alias: 'o',
             group: OUTPUT_GROUP,
             type: String,
             description: 'Output location of the file generated by webpack',
+            link: 'https://webpack.js.org/concepts/#output',
         },
         {
             name: 'plugin',
+            usage: '--plugin',
             group: ADVANCED_GROUP,
             type: String,
             description: 'Load a given plugin',
         },
         {
             name: 'global',
+            usage: '--global myVar ./global.js',
             alias: 'g',
             type: String,
             multiple: true,
@@ -184,60 +198,72 @@ module.exports = {
             type: String,
             group: ADVANCED_GROUP,
             description: 'Sets the build target',
+            link: 'https://webpack.js.org/configuration/target/#target',
         },
         {
             name: 'watch',
+            usage: '--watch',
             type: Boolean,
             alias: 'w',
             group: BASIC_GROUP,
             description: 'Watch for files changes',
         },
         {
             name: 'hot',
+            usage: '--hot',
             alias: 'h',
             type: Boolean,
             group: ADVANCED_GROUP,
             description: 'Enables Hot Module Replacement',
         },
         {
             name: 'sourcemap',
+            usage: '--sourcemap <sourcemap|eval|>',
             type: String,
             alias: 's',
             defaultValue: undefined,
             group: BASIC_GROUP,
             description: 'Determine source maps to use',
+            link: 'https://webpack.js.org/configuration/devtool/#devtool',
         },
         {
             name: 'prefetch',
+            usage: '--prefetch <request>',
             type: String,
             group: ADVANCED_GROUP,
             description: 'Prefetch this request',
         },
         {
             name: 'json',
+            usage: '--json',
             type: Boolean,
             alias: 'j',
             description: 'Prints result as JSON',
             group: DISPLAY_GROUP,
         },
         {
             name: 'dev',
+            usage: '--dev',
             alias: 'd',
             type: Boolean,
             defaultValue: undefined,
             group: BASIC_GROUP,
             description: 'Run development build',
+            link: 'https://webpack.js.org/concepts/#mode',
         },
         {
             name: 'prod',
             alias: 'p',
+            usage: '--prod',
             type: Boolean,
             defaultValue: undefined,
             group: BASIC_GROUP,
             description: 'Run production build',
+            link: 'https://webpack.js.org/concepts/#mode',
         },
         {
             name: 'version',
+            usage: '--version',
             type: Boolean,
             group: BASIC_GROUP,
             description: 'Get current version',

lib/utils/commands.js

@@ -1,5 +1,6 @@
 const { commands } = require('./cli-flags');
 
+// Contains a array of strings with commands and their alias that cli supports
 const names = commands
     .map(({ alias, name }) => {
         if (alias) {
@@ -9,5 +10,4 @@ const names = commands
     })
     .reduce((arr, val) => arr.concat(val), []);
 
-module.exports.names = names;
-module.exports.info = commands;
+module.exports = { names };

lib/utils/core-flags.js

@@ -0,0 +1,14 @@
+const { core } = require('./cli-flags');
+
+// Contains a array of strings with core cli flags and their alias
+const names = core
+    .map(({ alias, name }) => {
+        if (name === 'help') return [];
+        if (alias) {
+            return [`--${name}`, `-${alias}`];
+        }
+        return [`--${name}`];
+    })
+    .reduce((arr, val) => arr.concat(val), []);
+
+module.exports = { names };

lib/webpack-cli.js

@@ -164,11 +164,14 @@ class WebpackCLI extends GroupHelper {
 
     runHelp(args) {
         const HelpGroup = require('./groups/help');
-        const { names } = require('./utils/commands');
-        const command = names.filter(name => {
+        const commandNames = require('./utils/commands').names;
+        const flagNames = require('./utils/core-flags').names;
+        const allNames = [...commandNames, ...flagNames];
+        const subject = allNames.filter(name => {
             return args.includes(name);
         })[0];
-        return new HelpGroup().outputHelp(command);
+        const isCommand = commandNames.includes(subject);
+        return new HelpGroup().outputHelp(isCommand, subject);
     }
 
     runVersion() {