La configuración de RequireJS ofrece muchas posibilidades para hacer gran cantidad de cosas útiles. La semana pasada, por ejemplo, os contaba cómo forzar la descarga de todos los scripts/módulos de una página inhabilitando la caché gracias a un parámetro añadido automáticamente a todas las peticiones.
En esta ocasión me voy a fijar en otro parámetro interesante llamado map.
La función de este parámetro es "mapear" ciertos módulos de manera especial cuando sean dependencias de otros módulos.
Por ejemplo, imagínate que tienes que usar dos versiones del mismo módulo (digamos jQuery), pero quieres usar una en particular para un determinado módulo que depende de ella, y la otra para otro módulo diferente.
Supongamos que tenemos una estructura de archivos como esta:
- modulo1.js
- modulo2.js
- libs/
- jquery1.11.2.js
- jquery2.1.3.js
Es decir, dos módulos en la raíz de la carpeta de scripts, y una subcarpeta "libs" con las dos versiones de jQuery. Imaginemos ahora que el módulo número 1 necesita soportar navegadores antiguos, así que requerimos en éste el uso de la versión 1.x de jQuery (la 2.x no soporta versiones antiguas de los navegadores, y en especial de Internet Explorer), mientras que el resto de la aplicación usará jQuery 2.x.
O sea, modulo1.js requiere jQuery 1.11.2, y cualquier otro módulo de la aplicación requiere jQuery 2.1.3.
Podemos indicar este caso mediante la siguiente configuración de RequireJS:
requirejs.config({
map: {
'*': {
'jquery': 'jquery2.1.3'
},
'modulo1': {
'jquery': 'jquery1.11.2'
}
}
});Fíjate en que usamos el asterisco "*" para indicar todos los módulos, pero luego especificamos una excepción para el módulo llamado "modulo1".
Con esto conseguimos algo estupendo: que cuando escribamos "jquery" como una dependencia para un módulo cualquiera, se usará la versión 2.1.3 de la famosa biblioteca. Pero si usamos "jquery" como dependencia en el módulo "modulo1", se usará la versión 1.11.2 en ese caso únicamente.
No tendremos que estar especificando a mano la versión en cada caso, algo que sería una locura de mantener en caso de tener muchos módulos con excepciones. Dispondremos un lugar central en el que podemos especificar estas excepciones y cambiar la versión de manera fácil. Además en todos los módulos especificaremos simplemente "jquery" como dependencia, sin necesidad de preocuparnos de la versión concreta que sea necesaria en cada caso.
Si más adelante queremos usar una versión diferente solo tendremos que tocar la configuración, pero no será necesario modificar ningún archivo .js de módulos, con la gran ventaja de mantenimiento que ello nos supone.
¡Espero que te sea útil!
💪🏻 ¿Este post te ha ayudado?, ¿has aprendido algo nuevo?
Pues NO te pido que me invites a un café... Te pido algo más fácil y mucho mejor
