Publicar proyecto Vue 3 en Laravel Forge

Para publicar un proyecto Vue 3 en Laravel Forge sólo debemos seguir unos sencillos pasos.

Selecciona el tipo de proyecto

Al momento de crear tu Site en tu servidor Forge, selecciona el tipo de proyecto Static HTML.

Modifica el directorio raíz del sitio

Los proyectos Laravel tienen como directorio web el directorio /public, pero los proyectos Vue cuando son desplegados guardan su información en el directorio /dist, así que debemos decírselo a Forge.

Configura tu script de deploy

Una vez creado tu Site y sólo cuando tu repositorio esté sincronizado debes ajustar tu script de deploy por algo parecido a lo siguiente.

cd /home/forge/yoursite

git pull origin $FORGE_SITE_BRANCH

npm install
npm run build

La meta es que cuando realices el deploy de tu sitio el directorio dist sea generado.

Configura tu archivo de configuración Nginx

Ahora debemos decirle a nginx qué archivo servirá nuestro sitio, en este caso es el index.html en lugar del típico index.php de los proyectos Laravel.

location / {
    # try_files $uri $uri/ /index.php?$query_string;
    try_files $uri $uri/ /index.html;
}

Ajusta tu environment

Laravel Forge te ofrece una configuración directa desde su interfaz para gestionar tu archivo .env, puedes utilizarla, tu proyecto Vue la utilizará en entornos de producción sin ningún tipo de problema.

---

Si deseas aprender a manejar Laravel Forge de forma completa no te pierdas este curso.

Si deseas aprender a trabajar con Vue 3 a través de múltiples ejemplos no te pierdas la ruta de aprendizaje Vue 3.