Load esbuild-wasm from esm.sh instead of bundling it - #78
Merged
Conversation
The bare-specifier `new URL('esbuild-wasm/esbuild.wasm', import.meta.url)`
is no longer resolved to a real asset URL by webpack 5.109+, so the wasmURL
became `.../[object Object]` (404) and esbuild failed to initialize with a
cryptic `g[e] is not a function`, leaving the preview unable to run the
compiled script. Load the whole esbuild-wasm dependency from esm.sh at
runtime instead, mirroring how modern-monaco is loaded, with the installed
version inlined at build time via a `__ESBUILD_WASM_VERSION__` define. This
also removes the ~11 MB wasm and the esbuild chunk from consumer bundles.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HKLcgvaDcjK9ohA3fg7Ssq
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01HKLcgvaDcjK9ohA3fg7Ssq
Deploying studiometa-playground with
|
| Latest commit: |
acc7627
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://40571478.studiometa-playground.pages.dev |
| Branch Preview URL: | https://fix-esbuild-wasm-from-esm-sh.studiometa-playground.pages.dev |
|
Size Change: +49 B (+0.09%) Total Size: 54.2 kB 📦 View Changed
ℹ️ View Unchanged
|
Codecov Report❌ Patch coverage is
❌ Your patch check has failed because the patch coverage (0.00%) is below the target coverage (80.00%). You can increase the patch coverage or adjust the target coverage. Additional details and impacted files@@ Coverage Diff @@
## main #78 +/- ##
==========================================
- Coverage 34.06% 34.00% -0.07%
==========================================
Files 55 55
Lines 1133 1135 +2
Branches 231 232 +1
==========================================
Hits 386 386
- Misses 719 721 +2
Partials 28 28
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
titouanmathis
added a commit
to studiometa/ui
that referenced
this pull request
Sep 1, 2026
Moving to `@studiometa/playground` 0.4.0 left `patches/@studiometa+playground+0.3.13.patch` pinned to a version no longer installed, so `patch-package` failed in `postinstall` and took `npm ci` down with it. Every CI job died at install, before running any of this branch's code. Both hunks shipped upstream. Loading `esbuild-wasm` from esm.sh landed in 0.3.14 via studiometa/playground#78, and resolving the package root through `createRequire`/`realpathSync` is in 0.4.0's `PlaygroundLoadersPlugin` — verified against the installed dist rather than inferred. patch-package's own failure message suggests exactly this outcome: "Maybe this means your patch file is no longer necessary." `npm ci` now exits 0. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_011izFBQT4AsFcD4tVZz1f7R
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.
Problem
The playground bundles
esbuild-wasmthrough webpack and loads its wasm withnew URL('esbuild-wasm/esbuild.wasm', import.meta.url)inIframe.ts. Under webpack 5.109+, that bare-specifiernew URL(..., import.meta.url)is no longer resolved to a real asset URL — it compiles to a broken empty-module reference, so at runtimewasmURLbecomes.../[object Object](404). esbuild then fails to initialize and throws a crypticTypeError: g[e] is not a function(caught byupdateScript, logged as "script not updated due to some errors"), so the preview never runs the compiled script.Fix
Stop bundling
esbuild-wasmthrough webpack and load the whole dependency from esm.sh at runtime — exactly mirroring how the playground already loadsmodern-monacofrom esm.sh:scripts/shared.jsreads the installedesbuild-wasmversion and exposes it as an esbuild__ESBUILD_WASM_VERSION__define (same pattern as__MODERN_MONACO_VERSION__).Iframe.tsimportshttps://esm.sh/esbuild-wasm@<version>with a/* webpackIgnore: true */magic comment and pointswasmURLat the matching esm.sh URL. esm.sh serves the CJS API on thedefaultexport, so it is unwrapped withmod.default ?? mod.The
esbuild-wasmdependency stays inpackage.json— it is still used byscripts/shared.js(the build tool) and for the type-only import.This also removes the ~11 MB wasm and the esbuild chunk from consumers' built output.
Verification
Verified end-to-end in a real browser against the
@studiometa/uiplayground build: the console now logs "script updated!", the preview renders, and the esbuild chunk + 11 MB wasm are gone from the output. The emitteddist/front/js/components/Iframe.jsreferenceshttps://esm.sh/esbuild-wasm@0.24.2and no longer referencesnew URL("esbuild-wasm/esbuild.wasm", ...).npm run build,oxlint,prettier -c, and the fullvitestsuite (153 tests) all pass.Relation to other PRs
Independent of / stacks on top of #77 (
fix/virtual-loader-exports-resolution) — a separate webpack 5.109+ resolution fix.🤖 Generated with Claude Code
https://claude.ai/code/session_01HKLcgvaDcjK9ohA3fg7Ssq