VuePress

Este es un ejemplo de cómo configurar un sitio estático con VuePress en los servicios de Alojamiento de Sitios Estáticos de Kinsta a partir de un repositorio de GitHub.

VuePress es un generador de sitios estáticos que te permite embeber contenido dinámico en tus archivos Markdown utilizando componentes Vue para producir páginas HTML estáticas. Encontrarás más información en el sitio web de VuePress.

También puedes utilizar esta plantilla de inicio rápido en el Alojamiento de Aplicaciones de Kinsta sin ninguna configuración adicional. Si utilizas el Alojamiento de Aplicaciones, el comando de Inicio puede dejarse en blanco para el proceso web, ya que Kinsta detecta automáticamente el comando necesario durante el primer despliegue.

Requisitos Previos

  • Las plantillas de inicio rápido de Kinsta se almacenan y gestionan en GitHub; por lo tanto, necesitas una cuenta de GitHub para acceder a ellas.
  • Necesitas crear una cuenta MyKinsta para desplegar la aplicación.

Desplegar un Sitio Estático VuePress

  1. Accede a GitHub y crea un nuevo repositorio a partir de esta plantilla (Usar esta plantilla > Crear un nuevo repositorio): Kinsta – Hello World – Static Site with VuePress.
  2. En MyKinsta, haz clic en Sitios Estáticos > Añadir sitio > selecciona GitHub, haz clic en Conectar proveedor git > Autorizar, e inicia sesión en tu cuenta de GitHub.
  3. Elige el repositorio Hello World VuePress, haz clic en Continuar e introduce lo siguiente en la 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

Kinsta instala automáticamente las dependencias definidas en tu archivo composer.json durante el proceso de despliegue. El sitio está disponible en cuanto finaliza el despliegue, y la página Hello world se carga en la URL de tu sitio.

Aplicación VuePress.
Aplicación VuePress.

Ciclo de Vida del Despliegue

Siempre que inicies un despliegue (mediante la creación de una aplicación o un nuevo despliegue debido a un commit entrante), se ejecuta el comando npm build the, seguido del comando npm start.

¿Este artículo te ha resultado útil?