cloudflare-bundler-apps
Installation
SKILL.md
This skill teaches how to build apps that deploy cleanly through the space deploy pipeline. Every project committed to a space is built by @cloudflare/worker-bundler (createApp when there are static assets, createWorker when there are none) and served on a Dynamic Worker via WorkerLoader. Get the conventions right and the preview "just works". Get them wrong and you get a blank page, a 500, or a Build failed error.
How the pipeline works
When deploy_space(branch) is called, the space DO:
- Reads every file from the branch's working tree (skipping
.git/). - Parses
wrangler.json/wrangler.jsonc/wrangler.tomlformain,compatibility_date,compatibility_flags, and[assets]. - If
[assets].directoryis set, files under that directory become static assets served host-side byhandleAssetRequest. Everything else is built into a Worker viacreateApp(withserver: <main>). - If no assets directory is configured, only
createWorker({ entryPoint: <main> })is run. The output is loaded as a Dynamic Worker; all requests go to the Worker. - Previews are served at
/space/:name/preview/:branch/*. Responses withcontent-type: text/htmlare run throughHTMLRewriter, which prefixes root-relativesrc/href/actionattributes with the preview base path. JS-side fetches and dynamic imports are NOT rewritten.
Practical consequences:
- You can rely on root-relative
src="/foo.js"andhref="/style.css"in HTML. They will be rewritten to the preview path automatically. - You cannot rely on root-relative paths inside JS strings:
fetch("/api/x"),new URL("/foo", location.origin), dynamicimport("/lib.js"). These hit the wrong path under the preview prefix. Use relative paths (./api/x,import.meta.url) or read the base path from<base href>/ a meta tag injected at build time. - The
<base href>tag is also rewritten if present — using it lets all relative URLs resolve against the preview path.