Usa Bun con Astro

Bun es un entorno y conjunto de herramientas de JavaScript todo en uno. Consulta la documentación de Bun para obtener más información.

Precaución

Bun lanzó recientemente su primera versión estable. Sin embargo, al usar Bun con Astro, pueden aparecer problemas inesperados. Algunas integraciones pueden no funcionar como se espera. Consulta la documentación oficial de Bun para trabajar con Astro para obtener detalles adicionales.

Si tienes algún problema utilizando Bun, por favor abre un problema en GitHub directamente en el repositorio de Bun.

Prerrequisitos

Sección titulada Prerrequisitos

• Tener Bun instalado localmente en tu máquina. Consulta las instrucciones de instalación en la documentación oficial de Bun.

Crea un nuevo proyecto de Astro con Bun

Sección titulada Crea un nuevo proyecto de Astro con Bun

Crea un nuevo proyecto de Astro con Bun utilizando el siguiente comando create-astro:

bunx create-astro@latest my-astro-project-using-bun

Consejo

También puedes crear un nuevo proyecto de Astro a partir de cualquier repositorio de GitHub de Astro existente utilizando la bandera --template:

bunx create-astro@latest my-astro-project-using-bun --template eliancodes/brutal

Instalar dependencias

Sección titulada Instalar dependencias

Si estás comenzando un nuevo proyecto utilizando bunx create-astro, la CLI utilizará automáticamente Bun para instalar las dependencias y puedes omitir este paso.

De lo contrario, deberás instalar tus dependencias con Bun:

bun install

Agrega Tipos

Sección titulada Agrega Tipos

Bun publica el paquete bun-types, que contiene los tipos en runtime para Bun.

Instala bun-types utilizando el siguiente comando:

bun add -d bun-types

Agrega el paquete a tus tipos en tsconfig.json.

tsconfig.json

  "compilerOptions": {
    "types": ["bun-types"]
  }

Utilizando las integraciones de Astro

Sección titulada Utilizando las integraciones de Astro

También puedes utilizar cualquiera de las integraciones oficiales de Astro con el comando astro add:

bunx astro add react

Ejecuta Astro con Bun

Sección titulada Ejecuta Astro con Bun

Nota

Utiliza la bandera --bun en la CLI antes de cada comando astro para utilizar el propio entorno de ejecución de Bun en lugar de Node.

Ejecuta el servidor de desarrollo

Sección titulada Ejecuta el servidor de desarrollo

Para ejecutar el servidor de desarrollo utilizando Bun como el entorno de ejecución, utiliza el siguiente comando:

bunx --bun astro dev

Construyendo tu sitio con Bun

Sección titulada Construyendo tu sitio con Bun

Para construir tu sitio utilizando Bun como el entorno de ejecución, utiliza el siguiente comando:

bunx --bun astro build

Astro generará la salida de tu sitio en el directorio dist/. Luego, puedes servir tu sitio utilizando el comando preview:

bunx --bun astro preview

Agrega SSR con Bun usando @astrojs/node

Sección titulada Agrega SSR con Bun usando @astrojs/node

Las características de Bun incluyen compatibilidad con la API de Node.js. Utilizando el adaptador @astrojs/node, puedes agregar renderización del lado del servidor a tu proyecto de Astro utilizando el entorno de ejecución de Bun como sustituto de Node.

Ejecuta el siguiente comando para agregar el adaptador de Node.js a tu proyecto de Astro:

bunx astro add node

Construye tu sitio nuevamente utilizando el mismo comando de construcción mencionado anteriormente:

bunx --bun astro build

Finalmente, utiliza el siguiente comando para ejecutar tu sitio construido:

bun ./dist/server/entry.mjs

Recursos Oficiales

Sección titulada Recursos Oficiales

• Construye una aplicación con Astro y Bun

Recursos de la Comunidad

Sección titulada Recursos de la Comunidad

¿Estás usando Bun con Astro? ¡Agrega tu entrada de blog o video a esta página!

• Construyendo un sitio de Cloudflare Pages con Bun - entrada de blog