Conversation
Add @rspack/core, @rspack/plugin-react-refresh, and eslint-rspack-plugin as dependencies for the RSPack migration. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Create config/bundler.js to provide a unified API for switching between RSPack and webpack. This abstraction handles: - Bundler type detection (env var, package.json config, or default) - Plugin selection (CSS extract, copy, ESLint, React refresh) - Dev server instantiation - Source utilities and JS minimizer selection RSPack is now the default bundler. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update scripts/build.js and scripts/start.js to use the new bundler abstraction layer. This allows seamless switching between RSPack and webpack based on configuration. - Import getBundler and getBundlerType from config/bundler - Use bundler abstraction for compiler instantiation - Log which bundler is being used for transparency Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update config/webpack/plugins.js to dynamically select plugins based on the active bundler: - Use getCssExtractPlugin() for CSS extraction - Use getCopyPlugin() for asset copying - Use getEslintPlugin() for linting - Use forked DependencyExtractionPlugin for RSPack compatibility - Fix CSS filename function for RSPack compatibility Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update config/webpack/modules.js for RSPack compatibility: - Add hybrid babel/SWC loader approach - WordPress projects continue using babel-loader for proper dependency extraction - SWC loader only used for non-WordPress package builds without custom babel config - Import getCssExtractLoader from bundler abstraction Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update config/webpack/optimization.js to use getJsMinimizer() from bundler abstraction. RSPack uses built-in SwcJsMinimizerRspackPlugin while webpack continues to use TerserPlugin. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Fork @wordpress/dependency-extraction-webpack-plugin for RSPack compatibility. The original plugin uses webpack internals (ExternalsPlugin) that don't work fully with RSPack. Key changes: - Handle externals via compiler.options.externals array for RSPack - Maintain full compatibility with webpack via bundler detection - Generate correct .asset.php files with WordPress dependencies Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update config/webpack/plugins/clean-extracted-deps.js to use getSources() from bundler abstraction instead of directly requiring webpack-sources. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update config/webpack-fast-refresh.config.js to use bundler abstraction for React refresh plugin selection. RSPack uses @rspack/plugin-react-refresh while webpack uses @pmmmwh/react-refresh-webpack-plugin. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update test snapshots to reflect RSPack plugin names and configuration differences (CssExtractRspackPlugin, CopyRspackPlugin, etc.). Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive documentation for the RSPack migration at docs/rspack-migration.md covering: - Usage instructions and default behavior - Webpack fallback options (env var and package.json) - Performance benchmarks (~17-23% faster builds) - Technical implementation details - Plugin replacements and forked dependency extraction - Compatibility notes - Troubleshooting guide - Migration checklist - API reference Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add major version changeset documenting RSPack as the new default bundler with performance benefits and webpack fallback instructions. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Update introduction to mention RSPack as default bundler - Add new "RSPack & Bundler Configuration" section with: - Performance benchmark table - Webpack fallback instructions - Link to full migration guide Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
🦋 Changeset detectedLatest commit: d2692da The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Project Type: WordPress Block Project (use-block-assets) Total process time (including Node.js startup):
The compilation time improvements are significant (25-62%), but the |
The image-minimizer-webpack-plugin is not compatible with RSPack's lite-tapable implementation. It tries to tap into webpack-specific hooks that don't exist in RSPack, causing builds to fail with: TypeError: Cannot read properties of undefined (reading 'tap') Move ImageMinimizerPlugin configuration into bundler.js as a new getImageMinimizers() function that conditionally returns: - RSPack: empty array (images pass through unoptimized) - webpack: the two ImageMinimizerPlugin instances (images + SVGs) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Remove ImageMinimizerPlugin entries from snapshots since it's now conditionally excluded when using RSPack (the default bundler). Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update migration guide to note that image-minimizer-webpack-plugin is not compatible with RSPack. Images pass through without optimization when using RSPack. Users can use BUNDLER=webpack for image optimization. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This pull request makes RSPack the default bundler for
10up-toolkit, replacing webpack to provide significantly faster builds and improved performance for WordPress projects. It also updates documentation and test snapshots to reflect this change, while maintaining full backwards compatibility and offering webpack as a fallback option.Closes #451 Alternative to #466
Bundler Upgrade and Performance Improvements:
10up-toolkit, delivering approximately 17–23% faster build times, faster hot module replacement (HMR), and lower memory usage compared to webpack. Webpack remains available as a fallback via environment variable orpackage.jsonconfiguration. [1]], [2]], [3]])Documentation Updates:
README.mdto introduce RSPack as the default, document performance benchmarks, and provide instructions for using webpack as a fallback. Added a new section on bundler configuration and a reference to the RSPack migration guide. [1]], [2]])Test and Snapshot Adjustments:
webpack-basic-config.js.snapto use RSPack-specific loaders and plugins (e.g.,@rspack/core/dist/cssExtractLoader.js,CssExtractRspackPlugin,SwcJsMinimizerRspackPlugin,CopyRspackPlugin, andDependencyExtractionPlugin), replacing their webpack equivalents. [1]], [2]], [3]], [4]], [5]], [6]], [7]], [8]], [9]], [10]], [11]], [12]], [13]], [14]], [15]], [16]], [17]], [18]], [19]], [20]], [21]], [22]])Release Notes: