skills.rest
Hyperxq
HyperxqCOMMUNITY
Explore all skills by this author →
𝕏@DanielB05817361GitHub

rspack

Customize Rspack configuration entries and Module Federation settings in Rsbuild/Rslib projects.

1|Updated Dec 30, 2025
Search Tags:#preact#bundler#alias#rsbuild#rspack#module-federation#rslib
One-click install
npx skills add https://github.com/Hyperxq/modular-frontend-architecture --skill rspack-hyperxq
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: rspack
Source: https://github.com/Hyperxq/modular-frontend-architecture/tree/main/.claude/skills/rspack
Command: npx skills add https://github.com/Hyperxq/modular-frontend-architecture --skill rspack-hyperxq

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides authoritative, project-safe patterns for customizing Rspack configuration inside Rsbuild/Rslib workflows to avoid common pitfalls like duplicate runtimes, broken Module Federation identifiers, and accidental global config files.

Core Features & Use Cases

  • Alias and Loader Overrides: Safely add or override resolve.alias and module.rules from tools.rspack callbacks without overwriting existing nested objects.
  • Plugin Management: Show how to access built-in rspack plugins via the callback argument and add IgnorePlugin instances to exclude test files.
  • Module Federation Guidance: Prescribes pluginModuleFederation usage at the Rsbuild level, enforces underscore remote names, and mandates singleton Preact sharing to prevent runtime and hooks issues.
  • Use Case: Swap a production module for a local mock via resolve.alias and add a rule to inline SVG assets while keeping the rest of the Rspack config intact.

Quick Start

Edit your rsbuild.config.ts or rslib.config.ts and add a tools.rspack callback that safely initializes nested config paths (using ??= or ||=) and mutates resolve.alias, module.rules, or plugins as needed.

Frequently Asked Questions about rspack

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I customize Rspack config in Rsbuild without overwriting existing aliases?▼

To customize Rspack config safely, use the tools.rspack callback in rsbuild.config.ts and initialize nested paths with safe operators like ??= or ||= before mutating resolve.alias to prevent overwriting existing objects.

How does Module Federation work with Preact in an Rsbuild monorepo?▼

Module Federation in Rsbuild requires using pluginModuleFederation at the Rsbuild level, enforcing underscore remote names, and mandating singleton Preact sharing to prevent duplicate runtimes and hooks issues.

Can I add IgnorePlugin to exclude test files in an Rslib project?▼

Yes, you can add IgnorePlugin instances inside the tools.rspack callback in rslib.config.ts by accessing built-in Rspack plugins directly from the callback argument to safely exclude test files.

What's the best way to swap a production module for a local mock using Rspack?▼

The best way to swap a production module for a local mock is to modify resolve.alias within the tools.rspack callback, safely initializing the alias object first to keep the rest of the Rspack config intact.

Why does my Preact micro-frontend break when configuring Module Federation across host and remotes?▼

Preact micro-frontends break during Module Federation configuration when singleton Preact sharing is not enforced, leading to duplicate runtimes and inconsistent hooks behavior across host and remote applications.

Do I need to use safe initializers when adding loaders to Rspack rules?▼

Yes, you must use safe initializers like ??= or ||= when adding module.rules loaders via the tools.rspack callback to avoid overwriting existing nested Rspack configuration objects.

Related Skills

Explore More Software Engineering Skills→
HyperxqHyperxq
1

preact

Enforce Preact-specific imports and build settings in monorepo TypeScript projects.

Community
Intermediate
HyperxqHyperxq
1

rslib

Configure Rspack library builds with auto-discovered entries and multi-format outputs.

Community
Advanced
brGuirrabrGuirra

mf-perf

Analyze Module Federation configurations to detect HMR and build speed optimizations.

Community
Intermediate
mgd34msumgd34msu
4

webpack

Configures Webpack 5 for JavaScript/TypeScript bundling with modules, plugins, code splitting, and Module Federation.

Community
Advanced