Este es un ejemplo de cómo configurar una aplicación Nuxt o un sitio estático para desplegar en los servicios de Alojamiento de Aplicaciones o Sitios Estáticos de Kinsta desde un repositorio de GitHub.

Nuxt es un framework de desarrollo web de código abierto que permite crear aplicaciones Vue renderizadas en el servidor y sitios estáticos. Más información en el sitio web de Nuxt.

Durante el proceso de despliegue, Kinsta instala automáticamente las dependencias definidas en tu archivo package.json.

Alojamiento de Sitios Estáticos

  1. Inicia sesión en GitHub y crea un nuevo repositorio desde esta plantilla (Usar esta plantilla > Crear un nuevo repositorio): Kinsta – Hello World – NuxtJS.
  2. En MyKinsta, añade un sitio estático con el repositorio Hello World – NuxtJS y la siguiente Configuración de construcción:
    • Comando de construcción: npm run generate
    • Versión de Node: 18.16.0
    • Directorio de publicación: .output/public
  3. El sitio estará disponible en cuanto finalice la construcción, y la página Hello world se cargará en la URL de tu sitio.

Alojamiento de la Aplicación

  1. Inicia sesión en GitHub y crea un nuevo repositorio a partir de esta plantilla (Usa esta plantilla > Crea un nuevo repositorio): Kinsta — Hello World — NuxtJS.
  2. En MyKinsta, añade una aplicación con el repositorio Hello World — NuxtJS. El comando Start puede dejarse en blanco para el proceso web, ya que Kinsta detecta automáticamente el comando necesario durante el primer despliegue.
  3. La aplicación estará disponible en cuanto finalice la construcción, y la página Hello World se cargará en la URL de tu aplicación.

Configuración del Servidor Web

Puerto

Kinsta establece automáticamente la variable de entorno PORT. No necesitas definirla o programarla en la aplicación.

Comando de Inicio

Cuando despliegas la aplicación, Kinsta crea automáticamente un proceso web con npm start como comando de Inicio.

Ciclo de Vida del Despliegue

Cada vez que se inicia un despliegue (mediante la creación de una aplicación o el redespliegue debido a un commit entrante) se ejecuta el comando npm build, seguido del comando npm start.

Página Hello World

La aplicación está disponible en cuanto finaliza la construcción y la página Hello World se carga en la URL de tu aplicación o en la URL de tu sitio.

Página Hello World de Nuxt tras un despliegue correcto.
Página Hello World de Nuxt tras un despliegue correcto.