build(deps-dev): upgrade to Vite 8 and @vitejs/plugin-react 6#382
Open
build(deps-dev): upgrade to Vite 8 and @vitejs/plugin-react 6#382
Conversation
This was referenced Mar 17, 2026
Upgrade vite from v7.3.1 to v8.0.0 and @vitejs/plugin-react from v5.1.4 to v6.0.1. Remove vite-plugin-node-polyfills, which does not yet support Vite 8. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace vite-plugin-node-polyfills with resolve.alias stubs for path, fs, url, and source-map-js. These modules are imported by PostCSS, which @wordpress/block-editor loads via direct file paths (e.g., postcss/lib/processor), bypassing PostCSS's browser field. The stubs silence Vite's "externalized for browser compatibility" warnings without shipping real polyfills. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Vite 8 replaces Rollup with Rolldown, which may reorder side-effect imports relative to value imports (rolldown/rolldown#6436, vitejs/vite#5142). This causes mousetrap's global-bind plugin IIFE to execute before the main mousetrap module, so `window.Mousetrap` is not yet set and the `typeof Mousetrap` check fails. As a result, `bindGlobal` is never added to the prototype, breaking `@wordpress/keyboard-shortcuts`. The patch adds a `require("mousetrap")` fallback so the plugin resolves Mousetrap via the module system instead of relying on the global variable. This is preferred over Rolldown's `output.strictExecutionOrder` option, which would increase bundle size by injecting runtime helpers across the entire bundle. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2ffa7cc to
ef17c3b
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What?
Upgrade Vite from v7 to v8 and
@vitejs/plugin-reactfrom v5 to v6.Supersedes #373 and #380.
Why?
Vite 8 replaces esbuild and Rollup with Rolldown and Oxc, the new Rust-based build toolchain. This keeps us on the latest major version and unblocks upgrading
@vitejs/plugin-reactto v6, which was required by the Dependabot PR.How?
Dependency changes (
package.json)vite:^7.3.1→^8.0.0@vitejs/plugin-react:^5.1.4→^6.0.1vite-plugin-node-polyfills(does not support Vite 8, and was replaced by a lighter approach)Replace
vite-plugin-node-polyfillswith resolve stubs (vite.config.js,src/stubs/node-modules.js)PostCSS imports Node.js modules (
path,fs,url,source-map-js) that don't exist in browsers. PostCSS marks these asfalsein itsbrowserfield, but@wordpress/block-editorimports PostCSS via direct file paths (e.g.,postcss/lib/processor), bypassing that field and causing Vite to emit "Module has been externalized for browser compatibility" warnings.The
vite-plugin-node-polyfillsplugin suppressed these by providing full browser polyfills (~600 KB in dependencies), but PostCSS never actually calls these modules at runtime—it guards usage behindBoolean()checks. A single empty stub module aliased viaresolve.aliasachieves the same result with zero bundle impact and no external dependencies.Patch mousetrap global-bind plugin (
patches/mousetrap+1.6.5.patch)Vite 8's Rolldown bundler may reorder side-effect imports relative to value imports (rolldown/rolldown#6436, vitejs/vite#5142). This caused mousetrap's
global-bindplugin to execute before the main mousetrap module, sowindow.Mousetrapwas not yet set andbindGlobalwas never added to the prototype—breaking@wordpress/keyboard-shortcuts.The patch adds a
require("mousetrap")fallback so the plugin resolves Mousetrap via the module system instead of relying on the global. This is preferred over Rolldown'soutput.strictExecutionOrderoption, which would increase bundle size by injecting runtime helpers across the entire bundle.Testing Instructions
make dev-server) and verify the editor loads without errors in the browser console.make buildand verify it completes successfully.make test-jsand verify all tests pass.mousetrap[bindGlobal]errors appear.Accessibility Testing Instructions
N/A, no user-facing changes.
Footnotes
Requires adding a site to the demo app that has an active Jetpack connection—e.g., WoW/Atomic. ↩