fix: update CLI flags to use camelCase consistently (#9442)

web-infra-dev · Feb 24, 2025 · 80d8625 · 80d8625 · github-actions · Feb 24, 2025
1 parent 121557a
commit 80d8625
Show file tree

Hide file tree

Showing 7 changed files with 67 additions and 55 deletions.
diff --git a/packages/rspack-cli/src/cli.ts b/packages/rspack-cli/src/cli.ts
@@ -136,8 +136,8 @@ export class RspackCLI {
 			}
 			// to set output.path
 			item.output = item.output || {};
-			if (options["output-path"]) {
-				item.output.path = path.resolve(process.cwd(), options["output-path"]);
+			if (options.outputPath) {
+				item.output.path = path.resolve(process.cwd(), options.outputPath);
 			}
 			if (options.analyze) {
 				const { BundleAnalyzerPlugin } = await import(

diff --git a/packages/rspack-cli/src/types.ts b/packages/rspack-cli/src/types.ts
@@ -24,7 +24,7 @@ export interface RspackCLIOptions {
 	config?: string;
 	argv?: Record<string, any>;
 	configName?: string[];
-	"config-loader"?: string;
+	configLoader?: string;
 }
 
 export interface RspackBuildCLIOptions extends RspackCLIOptions {
@@ -36,7 +36,7 @@ export interface RspackBuildCLIOptions extends RspackCLIOptions {
 	profile?: boolean;
 	env?: Record<string, any>;
 	nodeEnv?: string;
-	"output-path"?: string;
+	outputPath?: string;
 }
 
 export interface RspackPreviewCLIOptions extends RspackCLIOptions {

diff --git a/packages/rspack-cli/src/utils/loadConfig.ts b/packages/rspack-cli/src/utils/loadConfig.ts
@@ -61,15 +61,15 @@ export async function loadRspackConfig(
 		if (!fs.existsSync(configPath)) {
 			throw new Error(`config file "${configPath}" not found.`);
 		}
-		if (isTsFile(configPath) && options["config-loader"] === "register") {
+		if (isTsFile(configPath) && options.configLoader === "register") {
 			await registerLoader(configPath);
 		}
 		return crossImport(configPath, cwd);
 	}
 
 	const defaultConfig = findConfig(path.resolve(cwd, DEFAULT_CONFIG_NAME));
 	if (defaultConfig) {
-		if (isTsFile(defaultConfig) && options["config-loader"] === "register") {
+		if (isTsFile(defaultConfig) && options.configLoader === "register") {
 			await registerLoader(defaultConfig);
 		}
 		return crossImport(defaultConfig, cwd);

diff --git a/packages/rspack-cli/src/utils/options.ts b/packages/rspack-cli/src/utils/options.ts
@@ -13,7 +13,7 @@ export const commonOptions = (yargs: yargs.Argv) => {
 				string: true,
 				describe: "entry file"
 			},
-			"output-path": {
+			outputPath: {
 				type: "string",
 				describe: "output path dir",
 				alias: "o"
@@ -30,7 +30,7 @@ export const commonOptions = (yargs: yargs.Argv) => {
 				string: true,
 				describe: "env passed to config function"
 			},
-			"node-env": {
+			nodeEnv: {
 				string: true,
 				describe: "sets process.env.NODE_ENV to be specified value"
 			},
@@ -45,7 +45,7 @@ export const commonOptions = (yargs: yargs.Argv) => {
 				string: true,
 				describe: "Name of the configuration to use."
 			},
-			"config-loader": {
+			configLoader: {
 				type: "string",
 				default: "register",
 				describe:

diff --git a/packages/rspack-cli/tests/build/basic/basic.test.ts b/packages/rspack-cli/tests/build/basic/basic.test.ts
@@ -80,7 +80,8 @@ describe("build command", () => {
 		expect(mainJs).toContain("other");
 		expect(mainJs).not.toContain("CONFIG");
 	});
-	it.each(["-o", "--output-path"])(
+
+	it.each(["-o", "--output-path", "--outputPath"])(
 		"output-path option %p should have higher priority than config",
 		async command => {
 			const { exitCode, stderr, stdout } = await run(__dirname, [

diff --git a/website/docs/en/api/cli.mdx b/website/docs/en/api/cli.mdx
@@ -9,6 +9,30 @@
 `@rspack/cli` is not compatible with `webpack-cli`, so there will be some differences between the two.
 :::
 
+## All commands
+
+To view all available CLI commands, run the following command in the project directory:
+
+```bash
+npx rspack -h
+```
+
+## Common flags
+
+Rspack CLI provides several common flags that can be used with all commands:
+
+| Flag                 | Description                                                                                                                    |
+| -------------------- | ------------------------------------------------------------------------------------------------------------------------------ |
+| -c, --config [value] | Specify the path to the configuration file, see [Specify the configuration file](/config/index#specify-the-configuration-file) |
+| --configLoader       | Specify the loader to load the config file, can be `native` or `register`, defaults to `register`                              |
+| --configName         | Specify the name of the configuration to use.                                                                                  |
+| -h, --help           | Show help information                                                                                                          |
+| -v, --version        | Show version number                                                                                                            |
+
+:::tip
+All flags in Rspack CLI support the `camelCase` and `kebab-case`, for example, both `--configLoader` and `--config-loader` are valid.
+:::
+
 ## rspack build
 
 `rspack build` is used to run Rspack build, which will generate the output files in the [output.path](/config/output#outputpath) directory.
@@ -35,17 +59,13 @@ The complete flags are as follows:
 rspack build
 
 Options:
-  -c, --config         config file                                      [string]
       --entry          entry file                                        [array]
-  -o, --output-path    output path dir                                  [string]
+  -o, --outputPath     output path dir                                  [string]
   -m, --mode           mode                                             [string]
   -w, --watch          watch                          [boolean] [default: false]
       --env            env passed to config function                     [array]
-      --node-env       sets process.env.NODE_ENV to be specified value  [string]
+      --nodeEnv        sets process.env.NODE_ENV to be specified value  [string]
   -d, --devtool        devtool                        [boolean] [default: false]
-      --configName     Name of the configuration to use.                 [array]
-      --config-loader  Specify the loader to load the config file, can be
-                       `native` or `register`.    [string] [default: "register"]
       --analyze        analyze                        [boolean] [default: false]
       --json           emit stats json
       --profile        capture timing information for each module
@@ -79,22 +99,16 @@ The complete flags are as follows:
 rspack dev
 
 Options:
-  -c, --config         config file                                      [string]
       --entry          entry file                                        [array]
-  -o, --output-path    output path dir                                  [string]
+  -o, --outputPath     output path dir                                  [string]
   -m, --mode           mode                                             [string]
   -w, --watch          watch                          [boolean] [default: false]
       --env            env passed to config function                     [array]
-      --node-env       sets process.env.NODE_ENV to be specified value  [string]
+      --nodeEnv        sets process.env.NODE_ENV to be specified value  [string]
   -d, --devtool        devtool                        [boolean] [default: false]
-      --configName     Name of the configuration to use.                 [array]
-      --config-loader  Specify the loader to load the config file, can be
-                       `native` or `register`.    [string] [default: "register"]
       --hot            enables hot module replacement
       --port           allows to specify a port to use                  [number]
       --host           allows to specify a hostname to use              [string]
-  -v, --version        Show version number                             [boolean]
-  -h, --help           Show help                                       [boolean]
 ```
 
 ## rspack preview
@@ -116,23 +130,9 @@ Positionals:
   dir  directory want to preview                                        [string]
 
 Options:
-      --help        Show help                                          [boolean]
-      --version     Show version number                                [boolean]
       --publicPath  static resource server path                         [string]
-  -c, --config      config file                                         [string]
       --port        preview server port                                 [number]
       --host        preview server host                                 [string]
       --open        open browser                                       [boolean]
       --server      Configuration items for the server.                 [string]
-      --configName  Name of the configuration to use.                    [array]
 ```
-
-## Common flags
-
-Here are some common flags that are supported by all Rspack commands:
-
-| Flags                | Usage                                      |
-| -------------------- | ------------------------------------------ |
-| -c, --config [value] | Specify the path to the configuration file |
-| -h, --help           | Show help information                      |
-| -v, --version        | Show version number                        |
diff --git a/website/docs/zh/api/cli.mdx b/website/docs/zh/api/cli.mdx
@@ -9,6 +9,30 @@
 `@rspack/cli` 与 `webpack-cli` 并不是完全兼容的，它们会有一些使用方式的差异。
 :::
 
+## 查看所有命令
+
+如果你需要查看所有可用的 CLI 命令，请在项目目录中运行以下命令：
+
+```bash
+npx rspack -h
+```
+
+## 公共选项
+
+Rspack CLI 提供了一些公共选项，可以用于所有命令：
+
+| 选项                 | 描述                                                                 |
+| -------------------- | -------------------------------------------------------------------- |
+| -c, --config [value] | 指定配置文件路径，详见 [指定配置文件](/config/index#指定配置文件)    |
+| --configLoader       | 指定配置文件加载器，可以是 `native` 或 `register`，默认是 `register` |
+| --configName         | 指定配置文件名称                                                     |
+| -h, --help           | 显示帮助信息                                                         |
+| -v, --version        | 显示版本号                                                           |
+
+:::tip
+Rspack CLI 的所有选项都支持使用 `camelCase`（驼峰命名）和 `kebab-case`（短横线命名），例如 `--configLoader` 和 `--config-loader` 都是有效的。
+:::
+
 ## rspack build
 
 `rspack build` 用于运行 Rspack 构建，将会在 [output.path](/config/output#outputpath) 目录下生成构建后的文件。
@@ -36,13 +60,12 @@ rspack build
 
 Options:
       --entry        entry file                                          [array]
-  -o, --output-path  output path dir                                    [string]
+  -o, --outputPath   output path dir                                    [string]
   -m, --mode         mode                                               [string]
   -w, --watch        watch                            [boolean] [default: false]
       --env          env passed to config function                       [array]
-      --node-env     sets process.env.NODE_ENV to be specified value    [string]
+      --nodeEnv     sets process.env.NODE_ENV to be specified value    [string]
   -d, --devtool      devtool                          [boolean] [default: false]
-      --configName   Name of the configuration to use.                   [array]
       --analyze      analyze                          [boolean] [default: false]
       --json         emit stats json
       --profile      capture timing information for each module
@@ -77,13 +100,12 @@ rspack dev
 
 Options:
       --entry        entry file                                          [array]
-  -o, --output-path  output path dir                                    [string]
+  -o, --outputPath   output path dir                                    [string]
   -m, --mode         mode                                               [string]
   -w, --watch        watch                            [boolean] [default: false]
       --env          env passed to config function                       [array]
-      --node-env     sets process.env.NODE_ENV to be specified value    [string]
+      --nodeEnv      sets process.env.NODE_ENV to be specified value    [string]
   -d, --devtool      devtool                          [boolean] [default: false]
-      --configName   Name of the configuration to use.                   [array]
       --hot          enables hot module replacement
       --port         allows to specify a port to use                    [number]
       --host         allows to specify a hostname to use                [string]
@@ -111,15 +133,4 @@ Options:
       --host        preview server host                                 [string]
       --open        open browser                                       [boolean]
       --server      Configuration items for the server.                 [string]
-      --configName  Name of the configuration to use.                    [array]
 ```
-
-## 公共选项
-
-下面是一些公共的选项，所有 Rspack 命令都支持这些选项：
-
-| 选项                 | 作用             |
-| -------------------- | ---------------- |
-| -c, --config [value] | 指定配置文件路径 |
-| -h, --help           | 显示帮助信息     |
-| -v, --version        | 显示版本号       |
Name	Base (2025-02-24 e8b77c4)	Current	Change
10000_big_production-mode_disable-minimize + exec	36.6 s ± 424 ms	37.7 s ± 416 ms	+2.92 %
10000_development-mode + exec	1.71 s ± 27 ms	1.72 s ± 33 ms	+0.09 %
10000_development-mode_hmr + exec	670 ms ± 13 ms	667 ms ± 5.4 ms	-0.46 %
10000_production-mode + exec	2.18 s ± 64 ms	2.19 s ± 96 ms	+0.50 %
10000_production-mode_persistent-cold + exec	2.32 s ± 60 ms	2.3 s ± 50 ms	-0.93 %
10000_production-mode_persistent-hot + exec	1.63 s ± 23 ms	1.62 s ± 30 ms	-0.91 %
arco-pro_development-mode + exec	1.73 s ± 129 ms	1.78 s ± 162 ms	+2.99 %
arco-pro_development-mode_hmr + exec	376 ms ± 3.2 ms	376 ms ± 1.8 ms	0.00 %
arco-pro_production-mode + exec	3.58 s ± 42 ms	3.53 s ± 67 ms	-1.48 %
arco-pro_production-mode_generate-package-json-webpack-plugin + exec	3.56 s ± 197 ms	3.66 s ± 291 ms	+2.81 %
arco-pro_production-mode_persistent-cold + exec	3.64 s ± 107 ms	3.61 s ± 100 ms	-0.70 %
arco-pro_production-mode_persistent-hot + exec	2.23 s ± 73 ms	2.35 s ± 242 ms	+5.43 %
arco-pro_production-mode_traverse-chunk-modules + exec	3.57 s ± 80 ms	3.56 s ± 85 ms	-0.16 %
large-dyn-imports_development-mode + exec	1.95 s ± 40 ms	1.98 s ± 70 ms	+1.38 %
large-dyn-imports_production-mode + exec	2.02 s ± 20 ms	2.01 s ± 38 ms	-0.50 %
threejs_development-mode_10x + exec	1.47 s ± 65 ms	1.42 s ± 19 ms	-3.30 %
threejs_development-mode_10x_hmr + exec	813 ms ± 29 ms	787 ms ± 35 ms	-3.21 %
threejs_production-mode_10x + exec	5.05 s ± 119 ms	5.04 s ± 132 ms	-0.17 %
threejs_production-mode_10x_persistent-cold + exec	5.16 s ± 452 ms	5.13 s ± 305 ms	-0.58 %
threejs_production-mode_10x_persistent-hot + exec	4.52 s ± 334 ms	4.42 s ± 63 ms	-2.25 %
10000_big_production-mode_disable-minimize + rss memory	8678 MiB ± 53.9 MiB	8662 MiB ± 33.9 MiB	-0.19 %
10000_development-mode + rss memory	648 MiB ± 37 MiB	651 MiB ± 32 MiB	+0.46 %
10000_development-mode_hmr + rss memory	1268 MiB ± 261 MiB	1202 MiB ± 234 MiB	-5.24 %
10000_production-mode + rss memory	618 MiB ± 6.5 MiB	627 MiB ± 8.54 MiB	+1.51 %
10000_production-mode_persistent-cold + rss memory	727 MiB ± 11.4 MiB	736 MiB ± 19.5 MiB	+1.33 %
10000_production-mode_persistent-hot + rss memory	700 MiB ± 10.1 MiB	701 MiB ± 18.9 MiB	+0.08 %
arco-pro_development-mode + rss memory	567 MiB ± 40.7 MiB	583 MiB ± 4.49 MiB	+2.77 %
arco-pro_development-mode_hmr + rss memory	652 MiB ± 75.8 MiB	644 MiB ± 110 MiB	-1.18 %
arco-pro_production-mode + rss memory	714 MiB ± 18.6 MiB	699 MiB ± 31.4 MiB	-2.04 %
arco-pro_production-mode_generate-package-json-webpack-plugin + rss memory	728 MiB ± 30.3 MiB	732 MiB ± 29.7 MiB	+0.52 %
arco-pro_production-mode_persistent-cold + rss memory	785 MiB ± 29.3 MiB	775 MiB ± 15.3 MiB	-1.28 %
arco-pro_production-mode_persistent-hot + rss memory	640 MiB ± 28.5 MiB	637 MiB ± 36.5 MiB	-0.35 %
arco-pro_production-mode_traverse-chunk-modules + rss memory	717 MiB ± 23.4 MiB	704 MiB ± 11.5 MiB	-1.87 %
large-dyn-imports_development-mode + rss memory	643 MiB ± 4.44 MiB	644 MiB ± 2.41 MiB	+0.26 %
large-dyn-imports_production-mode + rss memory	523 MiB ± 3.78 MiB	524 MiB ± 7.33 MiB	+0.09 %
threejs_development-mode_10x + rss memory	569 MiB ± 19.6 MiB	562 MiB ± 16.4 MiB	-1.13 %
threejs_development-mode_10x_hmr + rss memory	1207 MiB ± 75.4 MiB	1219 MiB ± 41.2 MiB	+0.96 %
threejs_production-mode_10x + rss memory	847 MiB ± 44.7 MiB	852 MiB ± 30.2 MiB	+0.57 %
threejs_production-mode_10x_persistent-cold + rss memory	969 MiB ± 48 MiB	954 MiB ± 40.1 MiB	-1.56 %
threejs_production-mode_10x_persistent-hot + rss memory	802 MiB ± 39.1 MiB	803 MiB ± 37.1 MiB	+0.14 %
suite	result
modernjs	❌ failure
rspress	✅ success
rslib	✅ success
rsbuild	❌ failure
rsdoctor	❌ failure
examples	✅ success
devserver	✅ success
nuxt	✅ success