Contribuir
Ayude a desarrollar Bootstrap con nuestros scripts y pruebas de compilación de documentación.
Configuración de herramientas
Bootstrap usa scripts npm para crear la documentación y compilar los archivos fuente. Nuestro paquete.json alberga estos scripts para compilar código, ejecutar pruebas y más. Estos no están destinados para su uso fuera de nuestro repositorio y documentación.
Para usar nuestro sistema de compilación y ejecutar nuestra documentación localmente, necesitará una copia de los archivos fuente de Bootstrap y Node. Siga estos pasos y debería estar listo para rockear:
- Descargue e instale Node.js , que usamos para administrar nuestras dependencias.
- Descargue las fuentes de Bootstrap o bifurque el repositorio de Bootstrap .
- Navegue hasta el directorio raíz
/bootstrap
y ejecutenpm install
para instalar nuestras dependencias locales enumeradas en package.json .
Cuando haya terminado, podrá ejecutar los diversos comandos proporcionados desde la línea de comandos.
Uso de secuencias de comandos npm
Nuestro paquete.json incluye numerosas tareas para desarrollar el proyecto. Ejecute npm run
para ver todos los scripts npm en su terminal. Las tareas principales incluyen:
Tarea | Descripción |
---|---|
npm start |
Compila CSS y JavaScript, crea la documentación e inicia un servidor local. |
npm run dist |
Crea el dist/ directorio con archivos compilados. Requiere Sass , Autoprefixer y terser . |
npm test |
Ejecuta pruebas localmente después de ejecutarnpm run dist |
npm run docs-serve |
Construye y ejecuta la documentación localmente. |
Hablar con descaro a
Bootstrap usa Dart Sass para compilar nuestros archivos fuente de Sass en archivos CSS (incluidos en nuestro proceso de compilación), y le recomendamos que haga lo mismo si está compilando Sass usando su propia canalización de activos. Anteriormente usábamos Node Sass para Bootstrap v4, pero LibSass y los paquetes construidos 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 el ajuste de este valor. No bajamos esta precisión durante el procesamiento posterior de nuestro CSS generado, como durante la minificación, pero si elige hacerlo, le recomendamos mantener una precisión de al menos 6 para evitar problemas con el redondeo del navegador.
autoprefijador
Bootstrap usa Autoprefixer (incluido en nuestro proceso de compilación) para agregar automáticamente prefijos de proveedores a algunas propiedades de 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 eliminar la necesidad de combinaciones de proveedores como las que se encuentran en v3.
Mantenemos la lista de navegadores admitidos a través de Autoprefixer en un archivo separado dentro de nuestro repositorio de GitHub. Ver .browserslistrc para más detalles.
RTLCSS
Bootstrap usa RTLCSS para procesar CSS compilado y convertirlo a RTL, básicamente reemplazando las propiedades conscientes de la dirección horizontal (por ejemplo, padding-left
) con su opuesto. Solo nos permite escribir nuestro CSS una sola vez y hacer ajustes menores usando las directivas de control y valor de RTLCSS .
Documentación local
Ejecutar nuestra documentación localmente requiere el uso de Hugo, que se instala a través del paquete hugo-bin npm. 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. Así es como se pone en marcha:
- Ejecute la configuración de herramientas anterior para instalar todas las dependencias.
- Desde el directorio raíz
/bootstrap
, ejecutenpm run docs-serve
en la línea de comando. - Ábrelo
http://localhost:9001/
en tu navegador y listo.
Obtenga más información sobre el uso de Hugo leyendo su documentación .
Solución de problemas
Si encuentra problemas con la instalación de dependencias, desinstale todas las versiones de dependencia anteriores (globales y locales). Luego, vuelva a ejecutar npm install
.