Contribuir

Configuración de herramientas

Bootstrap usa scripts npm para crear la documentación y compilar los archivos fuente. Nuestro package.json alberga estos scripts para compilar código, ejecutar pruebas y más. Estos no están pensados para su uso fuera de nuestro repositorio y documentación.

Para usar nuestro sistema de compilación y ejecutar nuestra documentación localmente, necesitarás una copia de los archivos fuente de Bootstrap y Node. Sigue estos pasos y deberías estar listo para rockear:

1. Descarga e instala Node.js, que usamos para administrar nuestras dependencias.
2. Descarga las fuentes de Bootstrap o bifurca y clona el repositorio de Bootstrap.
3. Navega al directorio raíz /bootstrap y ejecuta npm install para instalar nuestras dependencias locales enumeradas en package.json.

Cuando esté completo, podrás ejecutar los distintos comandos proporcionados desde la línea de comandos.

Usar scripts npm

Nuestro package.json incluye numerosos tareas para el desarrollo del proyecto. Ejecuta npm run para ver todos los scripts npm en tu terminal. Las tareas principales incluyen:

Sass

Bootstrap usa Dart Sass para compilar nuestros archivos fuente Sass en archivos CSS (incluido en nuestro proceso de compilación), y te recomendamos que hagas lo mismo si estás compilando Sass utilizando tus propios assets. Anteriormente usamos Node Sass para Bootstrap v4, pero LibSass y los paquetes creados sobre él, incluido Node Sass, ahora están obsoletos..

Dart Sass utiliza una precisión de redondeo de 10 y por razones de eficiencia no permite ajustar este valor. No reducimos esta precisión durante el procesamiento posterior de nuestro CSS generado, como durante la minificación, pero si decides hacerlo, te recomendamos mantener una precisión de al menos 6 para evitar problemas con el redondeo del navegador.

Autoprefixer

Bootstrap usa Autoprefixer (incluido en nuestro proceso de compilación) para agregar automáticamente prefijos de proveedores a algunas propiedades CSS en el momento de la compilación. Hacerlo nos ahorra tiempo y código al permitirnos escribir partes clave de nuestro CSS una sola vez y al mismo tiempo eliminar la necesidad de mixins de proveedores como los que se encuentran en la versión 3.

Mantenemos la lista de navegadores compatibles con Autoprefixer en un archivo separado dentro de nuestro repositorio de GitHub. Consulta .browserslistrc para obtener más detalles.

RTLCSS

Bootstrap usa RTLCSS para procesar CSS compilado y convertirlos a RTL, básicamente reemplazando las propiedades que reconocen la dirección horizontal (por ejemplo padding-left) con su opuesto. Nos permite escribir nuestro CSS solo una vez y realizar ajustes menores usando las directivas de RTLCSS control y value.

Documentación local

La ejecución de nuestra documentación localmente requiere el uso de Hugo, que se instala a través del paquete npm hugo-bin. Hugo es un generador de sitios estáticos increíblemente rápido y bastante extensible que nos proporciona: inclusiones básicas, archivos basados en Markdown, plantillas y más. A continuación te indicamos cómo empezar:

1. Ejecuta la configuración de herramientas anterior para instalar todas las dependencias.
2. Desde el directorio raíz /bootstrap ejecuta npm run docs-serve en la línea de comando.
3. Abre http://localhost:9001/ en tu navegador y listo.

Aprende más sobre el uso de Hugo leyendo su documentación.

Solución de problemas

Si tienes problemas con la instalación de dependencias, desinstala todas las versiones de dependencias anteriores (globales y locales). Luego, vuelve a ejecutar npm install.