feat(cli): add dist-path CLI option (#8005)

Author: chenjiahan

e2e/cases/cli/output-dist-path/index.test.ts

@@ -0,0 +1,16 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { expect, expectFile, readDirContents, test } from '@e2e/helper';
+
+test('should set output dist path from CLI', async ({ execCliSync }) => {
+  execCliSync('build --dist-path dist-custom');
+
+  const distCustom = path.join(import.meta.dirname, 'dist-custom');
+  await expectFile(path.join(distCustom, 'index.html'));
+
+  const outputs = await readDirContents(distCustom);
+  const outputFiles = Object.keys(outputs);
+
+  expect(outputFiles.find((item) => item.includes('static/js/index.'))).toBeTruthy();
+  expect(fs.existsSync(path.join(import.meta.dirname, 'dist'))).toBeFalsy();
+});

e2e/cases/cli/output-dist-path/src/index.js

@@ -0,0 +1 @@
+console.log('hello!');

packages/core/src/cli/commands.ts

@@ -9,6 +9,7 @@ import { init } from './init';
 
 export type CommonOptions = {
   base?: string;
+  distPath?: string;
   root?: string;
   mode?: RsbuildMode;
   config?: string;
@@ -44,6 +45,7 @@ const applyCommonOptions = (cli: CAC) => {
     .option('--config-loader <loader>', 'Set the config file loader (auto | jiti | native)', {
       default: 'auto',
     })
+    .option('--dist-path <dir>', 'Set the root directory of output files')
     .option('--env-dir <dir>', 'Set the directory for loading `.env` files')
     .option('--env-mode <mode>', 'Set the env mode to load the `.env.[mode]` file')
     .option('--environment <name>', 'Set the environment name(s) to build', {

packages/core/src/cli/init.ts

@@ -57,6 +57,16 @@ const loadConfig = async (root: string) => {
     config.server.port = commonOpts.port;
   }
 
+  if (commonOpts.distPath !== undefined) {
+    config.output ||= {};
+
+    const { distPath } = config.output;
+    config.output.distPath =
+      distPath && typeof distPath === 'object'
+        ? { ...distPath, root: commonOpts.distPath }
+        : { root: commonOpts.distPath };
+  }
+
   // enable CLI shortcuts by default when using Rsbuild CLI
   if (config.dev.cliShortcuts === undefined) {
     config.dev.cliShortcuts = true;

website/docs/en/guide/basic/cli.mdx

@@ -36,6 +36,7 @@ The Rsbuild CLI includes several common flags that work with all commands:
 | `--base <base>`            | Set the base path of the server, see [server.base](/config/server/base)                                                                    |
 | `-c, --config <config>`    | Set the configuration file (relative or absolute path), see [Specify config file](/guide/configuration/rsbuild#specify-config-file)        |
 | `--config-loader <loader>` | Set the config file loader (`auto` \| `jiti` \| `native`), see [Specify config loader](/guide/configuration/rsbuild#specify-config-loader) |
+| `--dist-path <dir>`        | Set the root directory of output files, see [output.distPath](/config/output/dist-path)                                                    |
 | `--env-mode <mode>`        | Set the env mode to load the `.env.[mode]` file, see [Env mode](/guide/advanced/env-vars#env-mode)                                         |
 | `--env-dir <dir>`          | Set the directory for loading `.env` files, see [Env directory](/guide/advanced/env-vars#env-directory)                                    |
 | `--environment <name>`     | Set the environment name(s) to build, see [Build specified environment](/guide/advanced/environments#build-a-specific-environment)         |

website/docs/zh/guide/basic/cli.mdx

@@ -36,6 +36,7 @@ Rsbuild CLI 提供了一些公共选项，可以用于所有命令：
 | `--base <base>`            | 指定服务端的基础路径，详见 [server.base](/config/server/base)                                                                 |
 | `-c, --config <config>`    | 指定配置文件路径（相对路径或绝对路径），详见 [指定配置文件](/guide/configuration/rsbuild#specify-config-file)                 |
 | `--config-loader <loader>` | 指定配置文件加载方式（`auto` \| `jiti` \| `native`），详见 [指定加载方式](/guide/configuration/rsbuild#specify-config-loader) |
+| `--dist-path <dir>`        | 指定构建产物的根目录，详见 [output.distPath](/config/output/dist-path)                                                        |
 | `--env-mode <mode>`        | 指定 env 模式来加载 `.env.[mode]` 文件，详见 [Env 模式](/guide/advanced/env-vars#env-mode)                                    |
 | `--env-dir <dir>`          | 指定目录来加载 `.env` 文件，详见 [Env 目录](/guide/advanced/env-vars#env-directory)                                           |
 | `--environment <name>`     | 指定需要构建的 environment 名称，详见 [构建指定环境](/guide/advanced/environments#build-a-specific-environment)               |