Este es un ejemplo de cómo configurar un sitio estático con VuePress en los servicios de Alojamiento de Aplicaciones o Sitios Estáticos de Kinsta desde un repositorio de GitHub.
VuePress es un generador de sitios estáticos que te permite incrustar contenido dinámico dentro de tus archivos Markdown usando componentes Vue para producir páginas HTML estáticas. Puedes encontrar más información en el sitio web de VuePress.
Kinsta instala automáticamente las dependencias definidas en su archivo composer.json durante el proceso de despliegue.
Alojamiento de Sitios Estáticos
- Inicia sesión en GitHub y crea un nuevo repositorio a partir de esta plantilla (Usar esta plantilla > Crear un nuevo repositorio): Kinsta – Hello World – Sitio Estático con VuePress
- En MyKinsta, añade una aplicación con el repositorio Hello World VuePress y la siguiente Configuración de construcción:
Comando de construcción: npm run build- Versión de Node: 16.20.0
- Directorio de publicación: ./docs/.vuepress/dist
- El sitio está disponible en cuanto finaliza la construcción, y la página Hello world se carga en la URL de tu sitio.
Alojamiento de la Aplicación
- Inicia sesión en GitHub y crea un nuevo repositorio a partir de esta plantilla (Usar esta plantilla > Crear un nuevo repositorio): Kinsta – Hola Mundo – Sitio Estático con VuePress
- En MyKinsta, añade una aplicación con el repositorio Hola Mundo VuePress. El comando Start se puede dejar en blanco para el proceso web ya que Kinsta detecta automáticamente el comando requerido durante el primer despliegue.
- La aplicación estará disponible en cuanto finalice la construcción y se cargue la página Hello world en la URL de tu aplicación.
Configuración del Servidor Web
Puerto
Kinsta establece automáticamente la variable de entorno PORT. No es necesario definirla o codificarla en la aplicación. El paquete serve utiliza automáticamente el puerto establecido por Kinsta.
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 (a través de la creación de una aplicación o re-despliegue debido a un commit entrante), se ejecuta el comando npm build the, seguido por el comando npm start.
Página Hello World
La aplicación o el sitio están disponibles 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 estático.
