diff --git a/.npmrc b/.npmrc
index 4f1c2ef2b..8a55ae9ca 100644
--- a/.npmrc
+++ b/.npmrc
@@ -1,3 +1,4 @@
registry = 'https://registry.npmjs.org/'
strict-peer-dependencies=false
+auto-install-peers=false
hoist-patterns[]=[]
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index ff4467969..3ccfe25dd 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -135,11 +135,3 @@ Here are the steps to publish (we generally use CI for releases and avoid publis
2. [Run the release action on release branch](https://github.com/web-infra-dev/rslib/actions/workflows/release.yml).
3. Merge the release pull request.
4. [Create Git tag on main branch and generate the release notes](https://github.com/web-infra-dev/rslib/releases).
-
-## Caveats
-
-The project is still in its early stages and under active development, so it possible dependents on Rsbuild or Rspack canary versions to test the latest features. The current versions are:
-
-| Package | Link |
-| ------------ | ------------------------------------------------------------ |
-| @rspack/core | https://github.com/web-infra-dev/rspack/releases/tag/v1.0.14 |
diff --git a/README.md b/README.md
index 8f9b65c11..0422fd974 100644
--- a/README.md
+++ b/README.md
@@ -12,7 +12,7 @@
-Rslib is a library build tool that leverages the well-designed configurations and plugins of [Rsbuild](https://rsbuild.dev), empowering library developers to take advantage of the extensive knowledge and ecosystem of webpack and Rspack.
+Rslib is a library development tool that leverages the well-designed configurations and plugins of [Rsbuild](https://rsbuild.dev), empowering library developers to take advantage of the extensive knowledge and ecosystem of webpack and Rspack.
Rslib provides a comprehensive set of build features for library development, including:
diff --git a/examples/express-plugin/rslib.config.ts b/examples/express-plugin/rslib.config.ts
index 3452d9301..5ef8af604 100644
--- a/examples/express-plugin/rslib.config.ts
+++ b/examples/express-plugin/rslib.config.ts
@@ -27,7 +27,4 @@ export default defineConfig({
},
},
],
- output: {
- target: 'node',
- },
});
diff --git a/examples/module-federation/mf-host/package.json b/examples/module-federation/mf-host/package.json
index d2271d5e9..a06f0595f 100644
--- a/examples/module-federation/mf-host/package.json
+++ b/examples/module-federation/mf-host/package.json
@@ -1,5 +1,5 @@
{
- "name": "@example/mf-host",
+ "name": "@examples/mf-host",
"version": "1.0.0",
"private": true,
"scripts": {
@@ -12,9 +12,9 @@
"react-dom": "^18.3.1"
},
"devDependencies": {
- "@module-federation/rsbuild-plugin": "^0.6.15",
- "@rsbuild/core": "~1.0.19",
- "@rsbuild/plugin-react": "^1.0.6",
+ "@module-federation/rsbuild-plugin": "^0.7.1",
+ "@rsbuild/core": "~1.1.0",
+ "@rsbuild/plugin-react": "^1.0.7",
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"typescript": "^5.6.3"
diff --git a/examples/module-federation/mf-host/rsbuild.config.ts b/examples/module-federation/mf-host/rsbuild.config.ts
index 38578026b..a73c0b5db 100644
--- a/examples/module-federation/mf-host/rsbuild.config.ts
+++ b/examples/module-federation/mf-host/rsbuild.config.ts
@@ -18,6 +18,8 @@ export default defineConfig({
singleton: true,
},
},
+ // Enable this when the output of Rslib is build under 'production' mode, while the host app is 'development'.
+ // Reference: https://lib.rsbuild.dev/guide/advanced/module-federation#faqs
shareStrategy: 'loaded-first',
}),
],
diff --git a/examples/module-federation/mf-react-component/.storybook/main.ts b/examples/module-federation/mf-react-component/.storybook/main.ts
new file mode 100644
index 000000000..3643264a4
--- /dev/null
+++ b/examples/module-federation/mf-react-component/.storybook/main.ts
@@ -0,0 +1,42 @@
+import { dirname, join } from 'node:path';
+import type { StorybookConfig } from 'storybook-react-rsbuild';
+
+/**
+ * This function is used to resolve the absolute path of a package.
+ * It is needed in projects that use Yarn PnP or are set up within a monorepo.
+ */
+function getAbsolutePath(value: string): any {
+ return dirname(require.resolve(join(value, 'package.json')));
+}
+
+const config: StorybookConfig = {
+ stories: [
+ '../stories/**/*.mdx',
+ '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)',
+ ],
+ framework: {
+ name: getAbsolutePath('storybook-react-rsbuild'),
+ options: {},
+ },
+ addons: [
+ {
+ name: getAbsolutePath('storybook-addon-rslib'),
+ options: {
+ rslib: {
+ include: ['**/stories/**'],
+ },
+ },
+ },
+ {
+ name: '@module-federation/storybook-addon/preset',
+ options: {
+ remotes: {
+ 'rslib-module':
+ 'rslib-module@http://localhost:3001/mf/mf-manifest.json',
+ },
+ },
+ },
+ ],
+};
+
+export default config;
diff --git a/examples/module-federation/mf-react-component/README.md b/examples/module-federation/mf-react-component/README.md
index f4c237d68..be4b26189 100644
--- a/examples/module-federation/mf-react-component/README.md
+++ b/examples/module-federation/mf-react-component/README.md
@@ -1,3 +1,37 @@
# @examples/mf-react-component
This example demonstrates how to use Rslib to build a simple Module Federation React component.
+
+### Usage
+
+Dev MF module
+
+1. Start remote module which is loaded by Rslib module.
+
+```
+nx run @examples/mf-remote:dev
+```
+
+2. Start MF dev mode.
+
+```
+nx run @examples/mf-react-component:dev
+```
+
+3. Use Storybook to development component.
+
+```
+nx run @examples/mf-react-component:storybook
+```
+
+Build
+
+```
+nx run @examples/mf-react-component:build
+```
+
+Build and Serve dist
+
+```
+nx run @examples/mf-react-component:serve
+```
diff --git a/examples/module-federation/mf-react-component/package.json b/examples/module-federation/mf-react-component/package.json
index c0fdf18c5..759a0cdd4 100644
--- a/examples/module-federation/mf-react-component/package.json
+++ b/examples/module-federation/mf-react-component/package.json
@@ -3,9 +3,9 @@
"private": true,
"exports": {
".": {
+ "types": "./dist/cjs/index.d.ts",
"import": "./dist/esm/index.mjs",
- "require": "./dist/cjs/index.js",
- "types": "./dist/cjs/index.d.ts"
+ "require": "./dist/cjs/index.js"
}
},
"main": "./dist/cjs/index.js",
@@ -13,17 +13,23 @@
"types": "./dist/cjs/index.d.ts",
"scripts": {
"build": "rslib build",
- "serve": "pnpm build && http-server -p 3001 ./dist/ --cors"
+ "dev": "rslib mf dev",
+ "serve": "pnpm build & http-server -p 3001 ./dist/ --cors",
+ "storybook": "storybook dev -p 6006"
},
"devDependencies": {
- "@module-federation/enhanced": "^0.6.15",
- "@module-federation/rsbuild-plugin": "^0.6.15",
- "@rsbuild/plugin-react": "^1.0.6",
+ "@module-federation/enhanced": "^0.7.1",
+ "@module-federation/rsbuild-plugin": "^0.7.1",
+ "@module-federation/storybook-addon": "0.0.0-next-20241106024856",
+ "@rsbuild/plugin-react": "^1.0.7",
"@rslib/core": "workspace:*",
"@types/react": "^18.3.12",
"http-server": "^14.1.1",
"react": "^18.3.1",
- "react-dom": "^18.3.1"
+ "react-dom": "^18.3.1",
+ "storybook": "^8.3.6",
+ "storybook-addon-rslib": "^0.1.3",
+ "storybook-react-rsbuild": "^0.1.3"
},
"peerDependencies": {
"react": "*"
diff --git a/examples/module-federation/mf-react-component/rslib.config.ts b/examples/module-federation/mf-react-component/rslib.config.ts
index 8eb13c332..271828b2d 100644
--- a/examples/module-federation/mf-react-component/rslib.config.ts
+++ b/examples/module-federation/mf-react-component/rslib.config.ts
@@ -37,6 +37,13 @@ export default defineConfig({
},
assetPrefix: 'http://localhost:3001/mf',
},
+ dev: {
+ assetPrefix: 'http://localhost:3001/mf',
+ },
+ // just for dev
+ server: {
+ port: 3001,
+ },
plugins: [
pluginModuleFederation({
name: 'rslib_provider',
@@ -55,5 +62,8 @@ export default defineConfig({
],
},
],
+ output: {
+ target: 'web',
+ },
plugins: [pluginReact()],
});
diff --git a/examples/module-federation/mf-react-component/stories/index.stories.tsx b/examples/module-federation/mf-react-component/stories/index.stories.tsx
new file mode 100644
index 000000000..0f48ef128
--- /dev/null
+++ b/examples/module-federation/mf-react-component/stories/index.stories.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+// @ts-ignore ignore remote module type check for passing ci run build because we set @mf-types folder in .gitignore
+import { Counter } from 'rslib-module';
+
+const Component = () => ;
+
+export default {
+ title: 'App Component',
+ component: Component,
+};
+
+export const Primary = {};
diff --git a/examples/module-federation/mf-react-component/tsconfig.json b/examples/module-federation/mf-react-component/tsconfig.json
index 19bcd30dd..9e2b51623 100644
--- a/examples/module-federation/mf-react-component/tsconfig.json
+++ b/examples/module-federation/mf-react-component/tsconfig.json
@@ -2,7 +2,11 @@
"compilerOptions": {
"jsx": "react-jsx",
"strict": true,
- "skipLibCheck": true
+ "skipLibCheck": true,
+ "esModuleInterop": true,
+ "paths": {
+ "*": ["./@mf-types/*"]
+ }
},
- "include": ["src/**/*"]
+ "include": ["src/**/*", "stories"]
}
diff --git a/examples/module-federation/mf-remote/package.json b/examples/module-federation/mf-remote/package.json
index 785dbdfd7..78ecd7242 100644
--- a/examples/module-federation/mf-remote/package.json
+++ b/examples/module-federation/mf-remote/package.json
@@ -1,5 +1,5 @@
{
- "name": "@example/mf-remote",
+ "name": "@examples/mf-remote",
"version": "1.0.0",
"private": true,
"scripts": {
@@ -12,9 +12,9 @@
"react-dom": "^18.3.1"
},
"devDependencies": {
- "@module-federation/rsbuild-plugin": "^0.6.15",
- "@rsbuild/core": "~1.0.19",
- "@rsbuild/plugin-react": "^1.0.6",
+ "@module-federation/rsbuild-plugin": "^0.7.1",
+ "@rsbuild/core": "~1.1.0",
+ "@rsbuild/plugin-react": "^1.0.7",
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"typescript": "^5.6.3"
diff --git a/examples/module-federation/package.json b/examples/module-federation/package.json
index 7514ad68c..1272ba6a4 100644
--- a/examples/module-federation/package.json
+++ b/examples/module-federation/package.json
@@ -1,10 +1,10 @@
{
- "name": "@example/mf",
+ "name": "@examples/mf",
"private": true,
"scripts": {
- "dev:all": "pnpm dev:host & pnpm dev:lib & pnpm dev:remote",
+ "dev:all": "pnpm dev:host & pnpm serve:lib & pnpm dev:remote",
"dev:host": "pnpm --filter mf-host dev",
- "dev:lib": "pnpm --filter mf-react-component run serve",
- "dev:remote": "pnpm --filter mf-remote dev"
+ "dev:remote": "pnpm --filter mf-remote dev",
+ "serve:lib": "pnpm --filter mf-react-component run serve"
}
}
diff --git a/examples/react-component-bundle-false/package.json b/examples/react-component-bundle-false/package.json
index 46fce9de2..64d79eb28 100644
--- a/examples/react-component-bundle-false/package.json
+++ b/examples/react-component-bundle-false/package.json
@@ -8,7 +8,7 @@
"build": "rslib build"
},
"devDependencies": {
- "@rsbuild/plugin-react": "^1.0.6",
+ "@rsbuild/plugin-react": "^1.0.7",
"@rsbuild/plugin-sass": "^1.1.0",
"@rslib/core": "workspace:*",
"@types/react": "^18.3.12",
diff --git a/examples/react-component-bundle-false/rslib.config.ts b/examples/react-component-bundle-false/rslib.config.ts
index 7dd310a6f..a5a3fccd3 100644
--- a/examples/react-component-bundle-false/rslib.config.ts
+++ b/examples/react-component-bundle-false/rslib.config.ts
@@ -35,6 +35,9 @@ export default defineConfig({
},
},
],
+ output: {
+ target: 'web',
+ },
plugins: [
pluginReact({
swcReactOptions: {
diff --git a/examples/react-component-bundle/package.json b/examples/react-component-bundle/package.json
index f0145353b..c84eef174 100644
--- a/examples/react-component-bundle/package.json
+++ b/examples/react-component-bundle/package.json
@@ -8,7 +8,7 @@
"build": "rslib build"
},
"devDependencies": {
- "@rsbuild/plugin-react": "^1.0.6",
+ "@rsbuild/plugin-react": "^1.0.7",
"@rsbuild/plugin-sass": "^1.1.0",
"@rslib/core": "workspace:*",
"@types/react": "^18.3.12",
diff --git a/examples/react-component-bundle/rslib.config.ts b/examples/react-component-bundle/rslib.config.ts
index 941177741..237965aed 100644
--- a/examples/react-component-bundle/rslib.config.ts
+++ b/examples/react-component-bundle/rslib.config.ts
@@ -33,6 +33,9 @@ export default defineConfig({
},
},
],
+ output: {
+ target: 'web',
+ },
plugins: [
pluginReact({
swcReactOptions: {
diff --git a/examples/react-component-umd/package.json b/examples/react-component-umd/package.json
index 7ee49b5ae..9d7a3d692 100644
--- a/examples/react-component-umd/package.json
+++ b/examples/react-component-umd/package.json
@@ -7,7 +7,7 @@
"build": "rslib build"
},
"devDependencies": {
- "@rsbuild/plugin-react": "^1.0.6",
+ "@rsbuild/plugin-react": "^1.0.7",
"@rsbuild/plugin-sass": "^1.1.0",
"@rslib/core": "workspace:*",
"@types/react": "^18.3.12",
diff --git a/examples/react-component-umd/rslib.config.ts b/examples/react-component-umd/rslib.config.ts
index 97c1f0ebd..b5e4971bf 100644
--- a/examples/react-component-umd/rslib.config.ts
+++ b/examples/react-component-umd/rslib.config.ts
@@ -17,6 +17,9 @@ export default defineConfig({
},
},
],
+ output: {
+ target: 'web',
+ },
plugins: [
pluginReact({
swcReactOptions: {
diff --git a/package.json b/package.json
index 6a105f8c3..e26e6aaf2 100644
--- a/package.json
+++ b/package.json
@@ -49,13 +49,13 @@
"cspell-ban-words": "^0.0.4",
"fs-extra": "^11.2.0",
"nano-staged": "^0.8.0",
- "nx": "^20.0.8",
+ "nx": "^20.0.12",
"prettier": "^3.3.3",
"prettier-plugin-packagejson": "^2.5.3",
"simple-git-hooks": "^2.11.1",
"typescript": "^5.6.3",
"vitest": "^2.1.4",
- "zx": "^8.2.0"
+ "zx": "^8.2.1"
},
"packageManager": "pnpm@9.12.1",
"engines": {
diff --git a/packages/core/README.md b/packages/core/README.md
index 98de17e74..9d0e1055a 100644
--- a/packages/core/README.md
+++ b/packages/core/README.md
@@ -4,7 +4,7 @@
# Rslib
-Rslib is a library build tool powered by [Rsbuild](https://rsbuild.dev). It allows library developers to leverage the knowledge and ecosystem of webpack and Rspack.
+Rslib is a library development tool powered by [Rsbuild](https://rsbuild.dev). It allows library developers to leverage the knowledge and ecosystem of webpack and Rspack.
## Documentation
diff --git a/packages/core/package.json b/packages/core/package.json
index 6d617c13d..67554c92e 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,7 +1,7 @@
{
"name": "@rslib/core",
- "version": "0.0.16",
- "description": "The Rspack-based library build tool.",
+ "version": "0.0.17",
+ "description": "The Rsbuild-based library development tool.",
"homepage": "https://lib.rsbuild.dev",
"bugs": {
"url": "https://github.com/web-infra-dev/rslib/issues"
@@ -37,7 +37,7 @@
"prebundle": "prebundle"
},
"dependencies": {
- "@rsbuild/core": "~1.0.19",
+ "@rsbuild/core": "~1.1.0",
"rsbuild-plugin-dts": "workspace:*",
"tinyglobby": "^0.2.10"
},
@@ -50,7 +50,7 @@
"memfs": "^4.14.0",
"picocolors": "1.1.1",
"prebundle": "1.2.5",
- "rslib": "npm:@rslib/core@0.0.15",
+ "rslib": "npm:@rslib/core@0.0.16",
"rslog": "^1.2.3",
"tsconfck": "3.1.4",
"typescript": "^5.6.3"
diff --git a/packages/core/rslib.config.ts b/packages/core/rslib.config.ts
index 4f725b59e..b894ac69b 100644
--- a/packages/core/rslib.config.ts
+++ b/packages/core/rslib.config.ts
@@ -21,6 +21,7 @@ export default defineConfig({
},
},
output: {
+ // TODO: Remove this after bumping Rslib
target: 'node',
externals: {
picocolors: '../compiled/picocolors/index.js',
diff --git a/packages/core/src/build.ts b/packages/core/src/build.ts
index a4894f95b..d689cb65b 100644
--- a/packages/core/src/build.ts
+++ b/packages/core/src/build.ts
@@ -1,13 +1,18 @@
-import type { RsbuildInstance } from '@rsbuild/core';
+import { type RsbuildInstance, createRsbuild } from '@rsbuild/core';
import type { BuildOptions } from './cli/commands';
-import { initRsbuild } from './config';
+import { composeRsbuildEnvironments, pruneEnvironments } from './config';
import type { RslibConfig } from './types/config';
export async function build(
config: RslibConfig,
options?: BuildOptions,
): Promise {
- const rsbuildInstance = await initRsbuild(config);
+ const environments = await composeRsbuildEnvironments(config);
+ const rsbuildInstance = await createRsbuild({
+ rsbuildConfig: {
+ environments: pruneEnvironments(environments, options?.lib),
+ },
+ });
await rsbuildInstance.build({
watch: options?.watch,
diff --git a/packages/core/src/cli/commands.ts b/packages/core/src/cli/commands.ts
index 49c10f7e6..b738f3f6d 100644
--- a/packages/core/src/cli/commands.ts
+++ b/packages/core/src/cli/commands.ts
@@ -1,12 +1,18 @@
-import type { RsbuildMode } from '@rsbuild/core';
+import { type RsbuildMode, createRsbuild } from '@rsbuild/core';
import { type Command, program } from 'commander';
import { build } from '../build';
-import { initRsbuild, loadConfig } from '../config';
+import {
+ composeRsbuildEnvironments,
+ loadConfig,
+ pruneEnvironments,
+} from '../config';
+import { startMFDevServer } from '../mf';
import { logger } from '../utils/logger';
export type CommonOptions = {
config?: string;
envMode?: string;
+ lib?: string[];
};
export type BuildOptions = CommonOptions & {
@@ -31,15 +37,25 @@ const applyCommonOptions = (command: Command) => {
);
};
+const repeatableOption = (value: string, previous: string[]) => {
+ return (previous ?? []).concat([value]);
+};
+
export function runCli(): void {
program.name('rslib').usage(' [options]').version(RSLIB_VERSION);
const buildCommand = program.command('build');
const inspectCommand = program.command('inspect');
+ const mfDevCommand = program.command('mf dev');
- [buildCommand, inspectCommand].forEach(applyCommonOptions);
+ [buildCommand, inspectCommand, mfDevCommand].forEach(applyCommonOptions);
buildCommand
+ .option(
+ '--lib ',
+ 'build the specified library (may be repeated)',
+ repeatableOption,
+ )
.option('-w --watch', 'turn on watch mode, watch for changes and rebuild')
.description('build the library for production')
.action(async (options: BuildOptions) => {
@@ -58,6 +74,11 @@ export function runCli(): void {
inspectCommand
.description('inspect the Rsbuild / Rspack configs of Rslib projects')
+ .option(
+ '--lib ',
+ 'inspect the specified library (may be repeated)',
+ repeatableOption,
+ )
.option(
'--output