Search code examples
bun

Bun how to start dev server

How can I start a dev server with bun? In webpack you can start a dev server with HMR like

webpack serve

with a custom webpack.config.js file somewhere in the folder.

Vite has a

vite

command, that will run the dev server via vite.config.ts config file somewhere.

with Bun I tried

bun index.ts

index.ts

const server = Bun.serve({
  port: 3000,
  fetch(req) {
    return new Response("Bun!");
  },
});

console.log(`Listening on http://localhost:${server.port} ...`);

but that will only always print "Bun!". There does not seem to be an option to set an entry point in Bun.serve as there is in Bun.build

There is a bun run https://bun.sh/docs/cli/run command as well but I'm not sure how to specify a port or a url or something with it.

My main goal is to have the same starting point as when I create a new project with vite and run the dev server -> open a URL to write my JS with HMR enabled

Solution

  • If you'd like to build a website with Bun.js, you can actually just use Vite with Bun, and everything will work as typical (see the guide).

    However, if you want to take full advantage of Bun's performance, you can use Hono.js (similar to Express) and some code:

    bunx create-hono my-app

    import { Hono } from "hono";
import { serveStatic } from "hono/bun";

const app = new Hono();
app.use("*", serveStatic({ root: "./src/" }));

export default app;

    bun run dev

    With the above code, any files under src/ will be mapped to your website (e.g., src/about.html will be available on http://localhost:3000/about.html). You can also use JSX with Hono.