CSS
Los estilos usan SASS para compilar los archivos CSS. Es necesario usar una gema llamada sass-globbing
, que permite la importación de batches de archivos usando wildcards. Por ejemplo hacer un:
import base/*
Para hacerlo correr se puede hacer un:
sass --watch -r sass-globbing .:../css
La idea es que haya dos versiones de la hoja de estilos, una dev y otra minificada para producción. Éstas se cargan condicionalmente leyendo una variable de entorno DEBUG_CSS
, que está en private_settings.py
y que se injecta en las plantillas a través de un context processor en mapafectos/context_processors.py
.
JS
De manera parecida, el javascript usa npm y webpack para gestionar dependencias, permitir el uso de ES6, y de manera análoga a los estilos, generar versiones distintas para desarrollo y producción. Si hemos clonado el repo o similar, primero tenemos que instalar las dependencias:
npm install
npm install --only=dev
Una vez con todo en su sitio, para observar cambios hacer un:
webpack --watch config webpack.dev.js
[en algunos sistemas: webpack --config webpack.dev.js
]
Respecto a la inyección condicional, el proceso es completamente análogo al de los estilos.