Deploying Remix apps to Cloudflare Workers depends on Cloudflare Pages specific CLI commands & code

[irvinebroque]

Context:

It's now possible to deploy Workers with Static Assets — which means one can deploy a Remix app to Workers, not just to Cloudflare Pages. You can try this by passing in the --experimental flag here:

npm create cloudflare@latest my-remix-app -- --framework=remix --experimental

Problem:

^ this works (somewhat paradoxically!) by running wrangler pages functions build --outdir build/worker after remix vite:build, to transform the Remix build output into a valid Cloudflare Worker. And having to interact with Cloudflare Pages specific commands, and see a command called createPagesFunctionsHandler and a /functions directory, feels like it can confuse people about both what they're deploying to, and whether they need to learn about Cloudflare Pages Functions in order to build their Remix app and deploy it to Workers (they don't).

What's going on here is — the Remix framework adapter, like other framework adapters for Cloudflare, targets the Pages Functions format. It defines an onRequest() handler here, and expects wrangler pages functions build to take this and build a Worker.

Ideas for how we could solve it:

If one were starting from scratch, only targeting Cloudflare Workers, on the surface it looks like the adapter could be quite simple — because Remix is rad and it generates a simple fetch handler from a build, I think it pretty much just needs to export that handler as the default export.

What's a bit less clear (at least to me, not the expert on the adapter) is if there could be a way to avoid the need for a /functions directory altogether, and instead handle all Cloudflare-specific configuration within vite.config.ts. That seems simpler...is it possible? Is it a bad idea because of how people rely on this in practice? I'm by no means expert here, but at minimum — figuring out some way to be clear in naming things something other than functions seems like it would help make things clearer for people...

It looks like there is already a remix/cloudflare-workers package that could be updated to provide a simpler path here, designed to work with Workers?

What could migrating an existing Remix app from Pages to Workers look like?

Cloudflare Pages isn't going anywhere, is fully supported, and still important to bring things from Workers to Pages. That said — it seems helpful to spell out, what would someone need to do, to migrate over? Since spelling it out kind of forces us to see how much surface area we expose that developers have to navigate.

As stated and shown above — things just work if you keep using the Pages adapter, so, putting aside Cloudflare Pages specific features like plugins, technically someone could already migrate from Cloudflare Pages to Workers just by doing this:

-    "build": "remix vite:build",
-    "deploy": "npm run build && wrangler pages deploy",
+    "build": "remix vite:build && wrangler pages functions build --outdir build/worker",
+    "deploy": "npm run build && wrangler deploy",

But to fully migrate to a simplified @remix-run/cloudflare-workers, one might...

1. rm -rf ./functions
2. npm uninstall @remix-run/cloudflare-pages
3. npm install --save-dev @remix-run/cloudflare-workers
4. Do ??? to generate a valid Worker from the Remix build (see question above about if possible to eliminate need for /functions/[[path]]/js)
5. Change the deploy command to run wrangler deploy instead of wrangler pages deploy:

-    "deploy": "npm run build && wrangler pages deploy",
+    "deploy": "npm run build && wrangler deploy",

^ what's missing from this? Can it be this simple?

Questions and feedback

I'm by no means expert here, and guessing someone comes along with a proposal that is more awesome than what I wrote up above. But I wanted to spell this out for myself to build an understanding around the state of the world, and kickstart discussion on what happens next — thinking about both Remix, and framework adapters more broadly.

Implementation details aside, the one thing I care most about in this is — I don't think someone building a Cloudflare Worker should need to be exposed to / think about Cloudflare Pages Functions in order to build things. The more that people can just build Remix apps (or any framework) – and directly target the actual Workers request handler (fetch(request, env, ctx)) and other primitives, the less indirection and the clearer the mental model will be for everyone. And the clearer path there will be for integrating with other parts of Cloudflare, a queue handler, a named entrypoint, an email worker, etc.

[threepointone]

My take on a simpler Remix template for Workers (sans Vite for now until the new environnmet work lands):
npm create cloudflare@latest my-remix-app -- --template github:threepointone/remix-workers-app

[zwily]

I submitted this PR to remix with something similar:

remix-run/remix#10041

Mine tries to get the template mostly up to date with how the other modern templates work too, which should make it easier to switch to vite when it's ready.

[jfsiii]

It looks like there is already a remix/cloudflare-workers package that could be updated to provide a simpler path here, designed to work with Workers?

There's a PR in progress