Costruire un frontend usando Vite e Bun

NOTE

Puoi usare Vite con Bun, ma molti progetti ottengono build più veloci e riducono centinaia di dipendenze passando agli [import HTML](/it/bundler/html-static).

Vite funziona out of the box con Bun. Inizia con uno dei template di Vite.

bash

bun create vite my-app

txt

✔ Select a framework: › React
✔ Select a variant: › TypeScript + SWC
Scaffolding project in /path/to/my-app...

Poi cd nella directory del progetto e installa le dipendenze.

bash

cd my-app
bun install

Avvia il server di sviluppo con la CLI di Vite usando bunx.

Il flag --bun dice a Bun di eseguire la CLI di Vite usando bun invece di node; per impostazione predefinita Bun rispetta la shebang line #!/usr/bin/env node di Vite.

bash

bunx --bun vite

Per semplificare questo comando, aggiorna lo script "dev" in package.json come segue.

json

  "scripts": {
    "dev": "vite", 
    "dev": "bunx --bun vite", 
    "build": "vite build",
    "serve": "vite preview"
  },
  // ...

Ora puoi avviare il server di sviluppo con bun run dev.

bash

bun run dev

Il comando seguente costruirà la tua app per la produzione.

bunx --bun vite build

Questa è una guida essenziale per iniziare con Vite + Bun. Per ulteriori informazioni, consulta la documentazione di Vite.