Rslib library build tool patterns for Rspack-based component libraries. Trigger: When configuring rslib.config.ts, library builds, Module Federation remotes, or dynamic entry discovery.
Rslib is a library build tool built on top of Rspack (Rust-based bundler). It replaces Rollup/Vite for library authors that need fast builds, Module Federation support, and fine-grained output control.
Keywords: rslib, rspack, library, module federation, build, dynamic entries, fast-glob
defineConfig from @rslib/core — not a plain object exportfast-glob auto-discoveryexclude: [/\.spec\.(ts|tsx|js|jsx)$/]tsconfig.build.json (not the root tsconfig.json) for library builds — avoids pulling in test types and dev-only pathsdts generation MUST be conditional on isLocalEnv — skipping it in CI cuts build time significantlyformat: "mf" is required for Module Federation remote buildspeerDependencies — the output bundles ZERO runtime code. Shell provides everything at runtime via MF shared configindex.ts that re-exports all components — each component is its own independent entryui-components has THREE output targets, each for a different consumer:
| Output | Format | Consumer | How |
|---|---|---|---|
| Module Federation | mf | shell at runtime | MF remote URL, Preact singleton shared |
| Import Maps | esm | Browsers with native import maps | <script type="importmap"> |
| Web Components | custom | Any framework or vanilla HTML | @r2wc/react-to-web-component wrapper |
Each component is its own independent entry — importing ONE component loads NOTHING else:
// ✅ Only Button is loaded — zero side effects on other components
import Button from "ui_components/atoms/Button/Button"
| Format | Use case |
|---|---|
esm | Standard npm package (tree-shakeable) |
cjs | CommonJS consumers (Node, legacy bundlers) |
mf | Module Federation remote (runtime sharing) |
rslib.config.ts — base patternimport { defineConfig, type RslibConfig } from "@rslib/core";
import { pluginPreact } from "@rsbuild/plugin-preact";
import { pluginSass } from "@rsbuild/plugin-sass";
import { pluginModuleFederation } from "@module-federation/rsbuild-plugin";
import { pluginNodePolyfill } from "@rsbuild/plugin-node-polyfill";
import { pluginEntries } from "./scripts/plugin-entries";
import { mfConfig } from "./mf.config";
const COMPONENTS_PATH = ["./lib/components/**/*.tsx"];
export default defineConfig(({ envMode = "development.local" }) => {
const isLocalEnv = envMode === "development.local";
return {
lib: [
{
format: "mf",
// Only generate .d.ts locally — CI doesn't need them, skip to save time
dts: isLocalEnv ? { distPath: "./dist/@mf-types" } : false,
output: {
distPath: { root: "./dist/mf" },
cleanDistPath: true,
filenameHash: true,
sourceMap: isLocalEnv ? { js: "cheap-module-source-map" } : false,
},
},
],
source: {
entry: pluginEntries(COMPONENTS_PATH),
exclude: [/\.spec\.(ts|tsx|js|jsx)$/],
tsconfigPath: "./tsconfig.build.json",
},
output: {
target: "web",
},
plugins: [
pluginPreact(),
pluginSass(),
pluginNodePolyfill(),
pluginModuleFederation(mfConfig),
],
};
});