[ToJans]

I've recently taken a legacy Typescript clientside codebase that was using webpack to generate tens of js packages from minutes to seconds by using bun [0] for both dev and build:

For dev I replaced webpack with "bun vite": it loads scripts ad hoc and is thus super fast at startup, and it still supports hot reloading.

For build I use "bun build". I've created a small script where I don't specify the output folder, but just intercept it, and do some simple search & replace things. It works perfectly, although it's a bit of a hack (simplified code):

   const result = await Bun.build({
     entrypoints: [srcName],
     root: "./",
     minify: true,
     naming: `${configuratorName}.[hash].[ext]`,
   });
   for (const r of result.outputs) {
     let jsSource = await r.text()
     jsSource = jsSource.replaceAll("import.meta.hot","false")
     Bun.write(outdir + r.path.substring(1), jsSource);
   }

It might not be pretty, but it works super fast, and it only took me a couple of hours to convert the whole thing...

Update:

For the record, the real script also uses the HtmlRewriter from cloudflare (included by default in bun) to alter some basic things in HTML templates as well...

[0] https://bun.sh

[tombl]

Bun.build actually has a `define:` option that does the same thing as your replace. If you use it, it'll even propagate the value, and treeshake away any `if(import.meta.hot)` you have.

[ToJans]

Very good tip; thank you!