Introducción

Esta entrada es más que nada un recordatorio para mí mismo. Se trata de una configuración de webpack para compilar aplicaciones y solucionar un error en ruta de assets al compilar para producción.

WebPack: error con ruta de assets

Como sabemos, con webpack se minifica el JavaScript y CSS, se junta todo en un archivo y cosas automáticas. Lo malo es que al ejecutar:

npm run build

Se crea el archivo html pero con rutas sin el punto. Es decir, algo así:

/ruta/a/javascript.js

En lugar de:

./ruta/a/javascript.js

Dependiendo del servidor esto puede traer problemas por las cosas de las rutas relativas y absolutas. A mí me ha pasado con apache.

Solución a error de rutas con WebPack

Lo que tenemos que haces es editar el archivo config/index.js en donde hay unas líneas que dicen:

Lo que hay que cambiar son las dos últimas líneas del fragmento mostrado arriba:

  • assetsSubDirectory
  • assetsPublicPath

Para arreglar este problema añadimos un punto al inicio de cada ruta, así:

Luego, al ejecutar:

npm run build

Pondrá rutas relativas al crear los archivos para producción, quitando este problema.


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 4,207 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.

A %d blogueros les gusta esto: