Eine App mit Nuxt und Bun erstellen

Bun unterstützt Nuxt out of the box. Initialisieren Sie eine Nuxt-App mit der offiziellen nuxi-CLI.

bunx nuxi init my-nuxt-app

txt

✔ Which package manager would you like to use?
bun
◐ Installing dependencies...
bun install v1.3.3 (16b4bf34)
 + @nuxt/devtools@0.8.2
 + nuxt@3.7.0
 785 packages installed [2.67s]
✔ Installation completed.
✔ Types generated in .nuxt
✨ Nuxt project has been created with the v3 template. Next steps:
 › cd my-nuxt-app
 › Start development server with bun run dev

Um den Dev-Server zu starten, führen Sie bun --bun run dev vom Projektstammverzeichnis aus. Dies führt den nuxt dev-Befehl aus (wie im "dev"-Skript in package.json definiert).

NOTE

Die `nuxt`-CLI verwendet standardmäßig Node.js; das Übergeben des `--bun`-Flags zwingt den Dev-Server, stattdessen die Bun-Laufzeit zu verwenden.

cd my-nuxt-app
bun --bun run dev

txt

nuxt dev
Nuxi 3.6.5
Nuxt 3.6.5 mit Nitro 2.5.2
  > Local:    http://localhost:3000/
  > Network:  http://192.168.0.21:3000/
  > Network:  http://[fd8a:d31d:481c:4883:1c64:3d90:9f83:d8a2]:3000/

✔ Nuxt DevTools ist aktiviert v0.8.0 (experimentell)
ℹ Vite client warmed up in 547ms
✔ Nitro built in 244 ms

Sobald der Dev-Server startet, öffnen Sie http://localhost:3000, um die App zu sehen. Die App rendert Nuxts integrierte NuxtWelcome-Template-Komponente.

Um mit der Entwicklung Ihrer App zu beginnen, ersetzen Sie <NuxtWelcome /> in app.vue durch Ihre eigene UI.

Für den Produktions-Build ist das Standard-Preset bereits mit Bun kompatibel, Sie können jedoch auch das Bun-Preset verwenden, um besser optimierte Builds zu generieren.

export default defineNuxtConfig({
  nitro: {
    preset: "bun",
  },
});

Alternativ können Sie das Preset über eine Umgebungsvariable festlegen:

NITRO_PRESET=bun bun run build

NOTE

Einige Pakete bieten Bun-spezifische Exports, die Nitro mit dem Standard-Preset nicht korrekt bündeln kann. In diesem Fall müssen Sie das Bun-Preset verwenden, damit die Pakete in Produktions-Builds korrekt funktionieren.

Nach dem Build mit Bun führen Sie aus:

bun run ./.output/server/index.mjs

Lesen Sie die Nuxt-Website für vollständige Dokumentation.