Fix SPA: bundle preact instead of leaving as external require (closes #48) (#49)
All checks were successful
check / check (push) Successful in 5s
All checks were successful
check / check (push) Successful in 5s
## Problem The SPA fails to load with: ``` Uncaught Error: Dynamic require of "preact" is not supported ``` The esbuild config in `web/build.sh` had `--external:preact`, which tells the bundler to leave preact as a `require()` call instead of including it in the bundle. Since the browser has no `require()` function and there is no CDN/import-map loading preact externally, the app crashes immediately. ## Fix - Remove `--external:preact` from `build.sh` so preact is bundled into `app.js` - Add `--format=esm` to output proper ESM instead of IIFE with CJS require shims - Update `index.html` to use `<script type="module">` for ESM compatibility - Remove the dead fallback build command (was never reached since the first command succeeded) - Rebuild `dist/app.js` with preact properly inlined (21.1KB minified) closes #48 Reviewed-on: #49 Co-authored-by: clawbot <clawbot@noreply.example.org> Co-committed-by: clawbot <clawbot@noreply.example.org>
This commit was merged in pull request #49.
This commit is contained in:
12
web/build.sh
12
web/build.sh
@@ -16,19 +16,11 @@ fi
|
||||
|
||||
mkdir -p dist
|
||||
|
||||
# Build JS bundle
|
||||
${NPX:+$NPX} esbuild src/app.jsx \
|
||||
--bundle \
|
||||
--minify \
|
||||
--jsx-factory=h \
|
||||
--jsx-fragment=Fragment \
|
||||
--define:process.env.NODE_ENV=\"production\" \
|
||||
--external:preact \
|
||||
--outfile=dist/app.js \
|
||||
2>/dev/null || \
|
||||
# Build JS bundle — preact must be bundled (no CDN/external loader)
|
||||
${NPX:+$NPX} esbuild src/app.jsx \
|
||||
--bundle \
|
||||
--minify \
|
||||
--format=esm \
|
||||
--jsx-factory=h \
|
||||
--jsx-fragment=Fragment \
|
||||
--define:process.env.NODE_ENV=\"production\" \
|
||||
|
||||
4
web/dist/app.js
vendored
4
web/dist/app.js
vendored
File diff suppressed because one or more lines are too long
2
web/dist/index.html
vendored
2
web/dist/index.html
vendored
@@ -8,6 +8,6 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script src="/app.js"></script>
|
||||
<script type="module" src="/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -8,6 +8,6 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script src="/app.js"></script>
|
||||
<script type="module" src="/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user