feat: support lib.id

Author: fi3ework

examples/react-component-bundle-false/src/index.scss renamed to examples/react-component-bundle-false/src/index.css

@@ -1,7 +1,7 @@
 import React from 'react';
 import { CounterButton } from './components/CounterButton/index';
 import { useCounter } from './useCounter';
-import './index.scss';
+import './index.css';
 
 export const Counter: React.FC = () => {
   const { count, increment, decrement } = useCounter();

examples/react-component-bundle-false/src/index.tsx

@@ -33,6 +33,7 @@ import type {
   AutoExternal,
   BannerAndFooter,
   DeepRequired,
+  ExcludesFalse,
   Format,
   LibConfig,
   LibOnlyConfig,
@@ -1182,7 +1183,7 @@ async function composeLibRsbuildConfig(config: LibConfig, configPath: string) {
 export async function composeCreateRsbuildConfig(
   rslibConfig: RslibConfig,
   path?: string,
-): Promise<{ format: Format; config: RsbuildConfig }[]> {
+): Promise<{ id?: string; format: Format; config: RsbuildConfig }[]> {
   const constantRsbuildConfig = await createConstantRsbuildConfig();
   const configPath = path ?? rslibConfig._privateMeta?.configFilePath!;
   const { lib: libConfigsArray, ...sharedRsbuildConfig } = rslibConfig;
@@ -1217,6 +1218,7 @@ export async function composeCreateRsbuildConfig(
     delete userConfig.output.externals;
 
     return {
+      id: libConfig.id,
       format: libConfig.format!,
       // The merge order represents the priority of the configuration
       // The priorities from high to low are as follows:
@@ -1230,6 +1232,7 @@ export async function composeCreateRsbuildConfig(
         constantRsbuildConfig,
         libRsbuildConfig,
         omit<LibConfig, keyof LibOnlyConfig>(userConfig, {
+          id: true,
           bundle: true,
           format: true,
           autoExtension: true,
@@ -1254,30 +1257,43 @@ export async function composeCreateRsbuildConfig(
 export async function composeRsbuildEnvironments(
   rslibConfig: RslibConfig,
 ): Promise<Record<string, EnvironmentConfig>> {
-  const rsbuildConfigObject = await composeCreateRsbuildConfig(rslibConfig);
+  const rsbuildConfigWithLibInfo =
+    await composeCreateRsbuildConfig(rslibConfig);
+
+  // User provided ids should take precedence over generated ids.
+  const usedIds = new Set<string>(
+    rsbuildConfigWithLibInfo
+      .map(({ id }) => id)
+      .filter(Boolean as any as ExcludesFalse),
+  );
   const environments: RsbuildConfig['environments'] = {};
-  const formatCount: Record<Format, number> = rsbuildConfigObject.reduce(
+  const formatCount: Record<Format, number> = rsbuildConfigWithLibInfo.reduce(
     (acc, { format }) => {
       acc[format] = (acc[format] ?? 0) + 1;
       return acc;
     },
     {} as Record<Format, number>,
   );
 
-  const formatIndex: Record<Format, number> = {
-    esm: 0,
-    cjs: 0,
-    umd: 0,
-    mf: 0,
-  };
+  const getDefaultId = (format: Format): string => {
+    const getMaybeId = () => {
+      let index = 0;
+      while (usedIds.has(`${format}${index}`)) {
+        index++;
+      }
 
-  for (const { format, config } of rsbuildConfigObject) {
-    const currentFormatCount = formatCount[format];
-    const currentFormatIndex = formatIndex[format]++;
+      const finalId =
+        formatCount[format] === 1 && index === 0 ? '' : `${format}${index}`;
+      usedIds.add(finalId);
+      return finalId;
+    };
+
+    return getMaybeId();
+  };
 
-    environments[
-      currentFormatCount === 1 ? format : `${format}${currentFormatIndex}`
-    ] = config;
+  for (const { format, id, config } of rsbuildConfigWithLibInfo) {
+    const libId = typeof id === 'string' ? id : getDefaultId(format);
+    environments[libId] = config;
   }
 
   return environments;

packages/core/src/config.ts

@@ -72,6 +72,16 @@ export type Redirect = {
 };
 
 export interface LibConfig extends RsbuildConfig {
+  /**
+   * Each lib configuration has a unique identifier used to distinguish different lib configurations.
+   * By default, Rslib generates a unique identifier based on the order of lib configurations, in the format `${format}${index}`.
+   * When there is only one lib of the format, the index is empty, otherwise, it starts from 0 and increments.
+   * For example:
+   * - If only ESM and CJS formats are configured, the identifier for ESM is `esm` and for CJS is `cjs`.
+   * - If two ESM formats and one CJS format are configured, they are represented as `esm0`, `esm1`, and `cjs`.
+   * @default undefined
+   */
+  id?: string;
   /**
    * Output format for the generated JavaScript files.
    * @default undefined

packages/core/src/types/config/index.ts

@@ -10,3 +10,5 @@ export type PkgJson = {
 export type DeepRequired<T> = Required<{
   [K in keyof T]: T[K] extends Required<T[K]> ? T[K] : DeepRequired<T[K]>;
 }>;
+
+export type ExcludesFalse = <T>(x: T | false | undefined | null) => x is T;

packages/core/src/types/utils.ts

@@ -230,6 +230,7 @@ exports[`Should compose create Rsbuild config correctly > Merge Rsbuild config 1
       },
     },
     "format": "esm",
+    "id": undefined,
   },
   {
     "config": {
@@ -455,6 +456,7 @@ exports[`Should compose create Rsbuild config correctly > Merge Rsbuild config 1
       },
     },
     "format": "cjs",
+    "id": undefined,
   },
   {
     "config": {
@@ -664,6 +666,7 @@ exports[`Should compose create Rsbuild config correctly > Merge Rsbuild config 1
       },
     },
     "format": "umd",
+    "id": undefined,
   },
 ]
 `;