rspack-best-practices

v2026.09.24

Configure, review, or troubleshoot Rspack builds, including loaders, CSS, assets, type checking, bundle optimization, and profiling.

GitHub
安装命令
npx skhub add rstackjs/rspack-best-practices
Markdown
SKILL.md

Rspack best practices

Apply these rules when writing or reviewing Rspack projects.

Configuration

  • Use rspack.config.ts and defineConfig
  • Define explicit entry values for multi-page applications
  • Keep one main config and branch by process.env.NODE_ENV only when needed
  • Keep rule conditions narrow and explicit (test, include, exclude, resourceQuery)
  • Prefer built-in Rspack plugins/loaders over community JS alternatives when equivalent features exist

CLI

If @rspack/cli is installed:

  • Use rspack dev for local development
  • Use rspack build for production build
  • Use rspack preview only for local production preview

Type checking

  • Use ts-checker-rspack-plugin for integrated dev/build type checks
  • Or run tsc --noEmit/vue-tsc --noEmit as an explicit script step

CSS

Choose one strategy:

  • Built-in CSS (type: 'css' | 'css/auto' | 'css/module') for modern setups
  • css-loader + CssExtractRspackPlugin for webpack migration compatibility
  • style-loader for pure style-in-JS runtime injection scenarios

Optional:

  • Use builtin:lightningcss-loader when goals are syntax downgrade + vendor prefixing
  • Use sass-loader/less-loader for preprocessing Sass/Less files
  • Use @tailwindcss/webpack for Tailwind CSS integration

Bundle size optimization

  • Prefer dynamic import() for non-critical code paths
  • Prefer lightweight libraries where possible
  • Keep target aligned with real compatibility requirements

Asset management

  • Import source-managed assets from project source directories, not from public
  • Reference public files by absolute URL path
  • Prefer asset modules (asset, asset/resource, asset/inline, asset/source) over legacy file-loader/url-loader/raw-loader

Profiling

  • Use Node CPU profiling (--cpu-prof) when JavaScript-side overhead is suspected
  • Use RSPACK_PROFILE=OVERVIEW and analyze trace output for compiler-phase bottlenecks
  • Replace known slow stacks first (babel-loader, PostCSS, terser) with Rspack built-ins when feasible

Security

  • Do not publish .map files to public servers/CDNs when production source maps are enabled

Documentation

发现
标签

此技能尚未发布标签。

版本
最新版本元数据

版本

v2026.09.24

发布时间

2026年9月24日

分类

未分类

许可证

MIT

源路径

skills/rspack-best-practices

默认分支

main

最新提交

1ccaad5

Tree SHA

05c93b7