En este tutorial te mostraré cómo hacer que la ruta pública de Vue (al usar la vue cli para compilar nuestros proyectos con npm run build) sea el directorio actual, es decir, ./.

Normalmente la Vue CLI va a compilar y crear el archivo index.html pero en las rutas habrá algo como:

script src=/js/script.js

Si te fijas, no tiene el ./, por lo que en varios servidores causará errores. Hoy te enseñaré cómo hacer que Vue CLI compile las rutas de manera relativa al directorio actual.

Configurando vue.config.js

En caso de que no exista, crea el archivo llamado vue.config.js. Luego dentro de module.exports agrega publicPath.

Sucede algo interesante y es que aunque se configure como ./, al compilar se elimina esa parte. Así que un truco es declarar la publicPath como ././ ya que cuando se elimine un ./ quedará el otro fragmento.

Para mi caso, el archivo completo queda así:

Y cuando se genera el index.html las rutas ya son relativas a ./ (al ejecutar npm run build) como se ve en el siguiente ejemplo:

Fíjate en que por ejemplo en la línea 21 está el src=./js/chunks-vendors.js

En cambio, sin esa configuración, sería src=/js/chunks-vendor.js. Puede que parezca algo simple, pero es algo importante sobre todo cuando la app se servirá en ciertos servidores como Apache.


Estoy disponible para trabajar en tu proyecto o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.
Si el post fue de tu agrado muestra tu apoyo compartiéndolo, suscribiéndote al blog, siguiéndome o realizando una donación.

Suscribir por correo

Ingresa tu correo y recibirás mis últimas entradas sobre programación, open source, bases de datos y todo lo relacionado con informática

Únete a otros 2,597 suscriptores


parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

0 Comentarios

Deja un comentario

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

A %d blogueros les gusta esto: