sneak/chat
1
0
Fork 0
Code Issues 17 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix: bundle preact into SPA instead of leaving as external require
All checks were successful
check / check (push) Successful in 57s
Details

Browse Source 
The esbuild config had --external:preact which told the bundler to leave
preact as a require() call instead of including it in the bundle. Since
the SPA loads app.js directly in the browser (no CDN or import map for
preact), the browser has no require() function and throws:

  Uncaught Error: Dynamic require of "preact" is not supported

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 shims
- Update index.html to use <script type="module"> for ESM compatibility
- Remove the fallback build command (no longer needed)
- Rebuild dist/app.js with preact properly inlined

closes #48
This commit is contained in:
clawbot
2026-03-07 05:48:10 -08:00
parent 2da7f11484
commit 2a29f41aa8
4 changed files with 6 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/build.sh
View File

@@ -16,19 +16,11 @@ fi
mkdir -p dist mkdir -p dist
# Build JS bundle # Build JS bundle — preact must be bundled (no CDN/external loader)
${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 || \
${NPX:+$NPX} esbuild src/app.jsx \ ${NPX:+$NPX} esbuild src/app.jsx \
--bundle \ --bundle \
--minify \ --minify \
--format=esm \
--jsx-factory=h \ --jsx-factory=h \
--jsx-fragment=Fragment \ --jsx-fragment=Fragment \
--define:process.env.NODE_ENV=\"production\" \ --define:process.env.NODE_ENV=\"production\" \

4
web/dist/app.js vendored
View File

File diff suppressed because one or more lines are too long

2
web/dist/index.html vendored
View File

@@ -8,6 +8,6 @@
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="/app.js"></script> <script type="module" src="/app.js"></script>
</body> </body>
</html> </html>

2
web/src/index.html
View File

@@ -8,6 +8,6 @@
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="/app.js"></script> <script type="module" src="/app.js"></script>
</body> </body>
</html> </html>