> ## Documentation Index
> Fetch the complete documentation index at: https://bun-1dd33a4e-farm-de84d354-pm-sbom.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Build an app with Nuxt and Bun

Bun supports [Nuxt](https://nuxt.com) with no extra configuration. Initialize a Nuxt app with the official `create-nuxt` CLI.

```sh terminal icon="terminal" theme={"theme":{"light":"github-light","dark":"dracula"}}
bun create nuxt@latest my-nuxt-app
```

```txt theme={"theme":{"light":"github-light","dark":"dracula"}}
┌  Welcome to Nuxt!
│
◇  Templates loaded
│
◇  Which template would you like to use?
│  minimal – Minimal starter with a single app.vue.
│
◇  Creating project in my-nuxt-app
│
◇  Downloaded minimal template
│
◇  Which package manager would you like to use?
│  bun
│
◇  Initialize git repository?
│  Yes
│
◇  Dependencies installed
│
◇  Git repository initialized
│
◇  Would you like to browse and install modules?
│  No
│
└  ✨ Nuxt project has been created with the minimal template.

╭── 👉 Next steps ─────╮
│                      │
│   › cd my-nuxt-app   │
│   › bun run dev      │
│                      │
╰──────────────────────╯
```

***

To start the dev server, run `bun --bun run dev` from the project root. This executes the `nuxt dev` command defined in the `"dev"` script in `package.json`.

<Note>
  The `nuxt` CLI uses Node.js by default; passing the `--bun` flag forces the dev server to use the Bun runtime instead.
</Note>

```sh terminal icon="terminal" theme={"theme":{"light":"github-light","dark":"dracula"}}
cd my-nuxt-app
bun --bun run dev
```

```txt theme={"theme":{"light":"github-light","dark":"dracula"}}
$ nuxt dev
│
●  Nuxt 4.5.2 (with Nitro 2.13.4, Vite 8.2.1 and Vue 3.5.41)

  ➜ Local:    http://localhost:3000/
  ➜ Network:  use --host to expose

  ➜ DevTools: press Shift + Alt + D in the browser (v3.4.1)

✔ Vite client built in 95ms
✔ Vite server built in 33ms
[nitro] ✔ Nuxt Nitro server built in 948ms
ℹ Vite server warmed up in 3ms
ℹ Vite client warmed up in 9ms
```

***

Once the dev server starts, open [http://localhost:3000](http://localhost:3000) to see the app. It renders Nuxt's built-in `NuxtWelcome` template component.

To start developing your app, replace `<NuxtWelcome />` in `app/app.vue` with your own UI.

<Frame>
  ![Demo Nuxt app running on
  localhost](https://github.com/oven-sh/bun/assets/3084745/2c683ecc-3298-4bb0-b8c0-cf4cfaea1daa)
</Frame>

***

For production builds, the default preset is compatible with Bun, but the [Bun preset](https://nitro.build/deploy/runtimes/bun) generates better optimized builds.

```ts nuxt.config.ts icon="https://mintcdn.com/bun-1dd33a4e-farm-de84d354-pm-sbom/IPGjipyt_DGwYrQc/icons/typescript.svg?fit=max&auto=format&n=IPGjipyt_DGwYrQc&q=85&s=4448657ec154e63e3a095030af59c903" theme={"theme":{"light":"github-light","dark":"dracula"}}
export default defineNuxtConfig({
  nitro: {
    preset: "bun", // [!code ++]
  },
});
```

Alternatively, set the preset with an environment variable:

```sh terminal icon="terminal" theme={"theme":{"light":"github-light","dark":"dracula"}}
NITRO_PRESET=bun bun run build
```

<Note>
  Some packages provide Bun-specific exports that Nitro does not bundle correctly with the default preset. Use the Bun
  preset so those packages work in production builds.
</Note>

After building, start the server:

```sh terminal icon="terminal" theme={"theme":{"light":"github-light","dark":"dracula"}}
bun run ./.output/server/index.mjs
```

***

Refer to the [Nuxt website](https://nuxt.com/docs) for complete documentation.
