Deno bundle replacement

Question

Could you please help me with replacing deprecetad deno bundle command?

I wanted to change it for esbuild, but running a command:

./node_modules/.bin/esbuild --bundle lib/commands/abc/main.ts --outfile=mod.abc.ts

give me an error:

[ERROR] Top-level await is currently not supported with the "iife" output format

I have tried also with --format=cjs and --format=esm option, but the output still is different than deno bundle output. eg. there are not imports included.

How should I use it?

Or maybe can you help me with other option? The goal is to quickly remove deno bundle without main code modification.

Answer 1

Straightforward solution to bundle Deno Typescript for the browser in 2024:

1. Create a new file: bundle.ts

Make sure to update entryPoints and outdir.

import * as esbuild from "https://deno.land/x/[email protected]/mod.js";
import { denoPlugins } from "jsr:@luca/[email protected]";

esbuild.build({
  plugins: [...denoPlugins()],
  entryPoints: ["<input>/<dir>/script.ts"],
  outdir: "<output>/<dir>/",
  bundle: true,
  platform: "browser",
  format: "esm",
  target: "esnext",
  minify: true,
  sourcemap: true,
  treeShaking: true,
});
await esbuild.stop();

2. Run it!

deno run --allow-read --allow-write --allow-env --allow-net --allow-run bundle.ts

You can create a deno task to make running this easier. Add this to your deno.jsonc:

{
  "tasks": {
    "bundle": "deno run --allow-read --allow-write --allow-env --allow-net --allow-run bundle.ts"
  }
}

Helpful resources:

• esbuild (git)
  • .build()
  • entryPoints: []
  • outdir
  • bundle: true
  • platform: "browser"
  • format: "esm"
  • target: "esnext"
  • minify: true
  • sourcemap: true
  • treeShaking: true
• esbuild-deno-loader/denoPlugins (deno.land/x) (git)
  • This is necessary if your input .ts files include import statements with Deno module specifiers like file:, https:, data:, npm:, and/or jsr:.

---

For more context, check out my post on this topic: https://www.toddgriffin.me/blog/how-to-bundle-deno-typescript-for-the-browser