Add a Bun template

[hjonasson]

👋 Hi there,

I had spent some time trying to run Remix on Bun. Then I found that it had already been done here by @jacob-ebey (who is already on the list of contributors, otherwise I would have added him there along with this PR). I checked out the repo to see if it worked with the new stable version of Bun and it does.

If this PR is accepted I will update the Bun docs regarding Remix (here). I am not sure that the comment there about Remix relying on Node APIs that Bun doesn't implement yet is correct. One of the selling points of Remix is that it doesn't rely on Node. Please correct me if I am missing something. As far as my research into it goes that comes from this discussion which looks like they are calling node with Bun 🤷 by accident.

If this better belongs as a package, @remix-run/bun for example please let me know and I will adjust.

Note that I am merging to main as the contribution docs here suggest "some templates" should go to main.

I would love to add some tests using the Bun test runner but am hesitant as it sounds like a lot of work adding it to CI as well. All pointers there are appreciated.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 2f29bea

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[kiliman]

FYI: Not only is @jacob-ebey a contributor, but he also works for Remix/Shopify. He implemented the defer support (in addition to many more features). Super smart guy.

[BryceBlankinship]

I tried running jacob's setup but bun run dev still starts a node process... am I missing something here? I read online through bun's docs that it still runs a node process... is there full support yet?

[hjonasson]

Thanks for looking at this PR @BryceBlankinship !

I tried running jacob's setup but bun run dev still starts a node process... am I missing something here? I read online through bun's docs that it still runs a node process... is there full support yet?

I have been researching this now and confirm a node process does start. I will get back about why that is if/when I find out why.

Out of curiosity, which docs are you referring to that say 'It still runs a node process'? What is it here? Bun? Or are you referring to this guide about Remix in Bun?

[BryceBlankinship]

Yes, I was paraphrasing that guide, thanks for checking it out!

[hjonasson]

I think I found it. It comes from when calling the remix command it is done with node. Adding serverPlatform: "neutral" doesn't fix it. I will keep investigating. A new package @remix-run/bun might be needed after all.

[hjonasson]

Creating a dedicated package does indeed seem necessary. I started a proposal discussion about it here and might put this PR on ice until that is resolved. Thanks a million for swift reviews and running the fairly obvious test of 'is it actually not running on node' 🤣

[trojanowski]

@hjonasson you can force the dev server to use Bun's runtime instead of Node.js by using the --bun flag, like this:

bun run --bun dev

However, it currently fails because the dev server attempts to use Intl.ListFormat, which isn't supported in Bun. Fortunately, this is already supported in newer JavaScriptCore versions, so we can expect a fix in the future.

More info: https://news.ycombinator.com/item?id=37435832

[hjonasson]

Wow! Thanks @trojanowski!

[marbemac]

However, it currently fails because the dev server attempts to use Intl.ListFormat, which isn't supported in Bun.

Coming in 1.0.3 - can try it now via bun upgrade --canary.

[sergiodxa]

However, it currently fails because the dev server attempts to use Intl.ListFormat, which isn't supported in Bun.

Coming in 1.0.3 - can try it now via bun upgrade --canary.

I upgraded to Bun canary and ran bun run --bun dev on my Remix app, I got this error:

Could not reach Remix dev server at http:https://localhost:3001/ping
22 | 	 * @param {string} type 
23 | 	 */
24 | 	constructor(message, type) {
25 | 		super(message);
26 | 		// Hide custom error implementation details from end-users
27 | 		Error.captureStackTrace(this, this.constructor);
     ^
error: request to http:https://localhost:3001/ping failed, reason: Can only call URLSearchParams.toJSON on instances of URLSearchParams
 code: "undefined"

      at new FetchBaseError (PATH/node_modules/@remix-run/web-fetch/dist/lib.node.cjs:27:2)
      at new FetchError (PATH/node_modules/@remix-run/web-fetch/dist/lib.node.cjs:65:2)
      at PATH/node_modules/@remix-run/web-fetch/dist/lib.node.cjs:1801:10
      at _final (node:http:840:16)
      at callFinal (node:stream:2763:44)
      at prefinish (node:stream:2786:44)
      at finishMaybe (node:stream:2793:48)
      at node:stream:2726:150
      at onend (node:stream:2079:40)
      at endReadableNT (node:stream:2387:52)
      at processTicksAndRejections (:55:76)

Note I'm using v1.19 and not v2 but I don't think that changed.

Good thing is that I didn't get the Intl.ListFormat error anymore.

[ryanstout]

@sergiodxa I'm seeing the same Can only call URLSearchParams.toJSON on instances of URLSearchParams error when trying to run remix under bun, were you able to resolve it? Thanks!

[sergiodxa]

@ryanstout I haven't tried again, but note that that only happens when running the remix dev script using Bun, if you're ok with the build using Node you can make the actual app use Bun

It's also possible that if you use the Remix's Vite plugin it could work with Bun too, but that depends if Vite runs on Bun.

[DimitryDushkin]

On default remix template, running bun run --bun dev (where dev: "remix vite:dev") now kind of works on fresh Bun 1.1, but gives this error:

[DimitryDushkin]

Huh, I made dev mode work! 🎉 Although, it works only for default remix + vite mode. The only change which were needed is to remove installGlobals() from vite.config.ts (I used standard template created via this instructions https://bun.sh/guides/ecosystem/remix) and run dev mode via bunx --bun vite (btw this command is mentioned in https://bun.sh/guides/ecosystem/vite)!

It turned out it's a lot harder to make a proper script to use Bun's HTTP server with Vite as dev server. Here is a partially working try — https://gist.github.com/DimitryDushkin/dd2c47c987ac569a818d355863440382 Run it via bun server.ts.
I used docs from here https://remix.run/docs/en/main/future/vite#migrating-a-custom-server

SSR in this server.tsx works, but serving built-on-fly dev files (like css, jsx, etc.) is not (returns 404). I guess the missing part is to make Vite's dev server middleware (viteDevServer.middlewares) to serve them, but I'm not sure how do it, since Bun is not supporting Express-style middleware.

[kiliman]

You should look at how Hono Vite dev server works.

https://github.com/honojs/vite-plugins/tree/main/packages/dev-server