Вклад

Установка средств разработки

Bootstrap использует npm-скрипты для сборки документации и компиляции исходных файлов. Наш package.json содержит эти скрипты для компиляции кода, запуска тестов и других задач. Они не предназначены для использования за пределами нашего репозитория и документации.

Для использования нашей системы сборки и запуска документации локально, вам понадобится копия исходных файлов Bootstrap и Node.js. Следуйте этим шагам:

1. Загрузите и установите Node.js, которое используется для управления зависимостями.
2. Скачайте исходные коды Bootstrap с этой страницы или создайте форк и клонируйте репозиторий Bootstrap.
3. Перейдите в корневой /bootstrap каталог и выполните npm install для установки локальных зависимостей, перечисленных в package.json.

После завершения, вы сможете запускать различные команды из командной строки.

Использование npm-скриптов

Наш package.json включает множество задач для разработки проекта. Запустите npm run в вашей терминале, чтобы увидеть все npm-скрипты. Основные задачи включают:

Sass

Bootstrap использует Dart Sass для компиляции наших Sass-файлов в CSS (включено в наш процесс сборки), и мы рекомендуем сделать то же самое, если вы компилируете Sass, используя свою собственную цепочку обработки ресурсов. Раньше мы использовали Node Sass для Bootstrap v4, но LibSass и пакеты, построенные на его основе, включая Node Sass, теперь устарели.

Dart Sass использует точность округления 10 и по соображениям эффективности не позволяет изменять это значение. Мы не понижаем эту точность при дальнейшей обработке сгенерированного CSS, например, во время минификации, но если вы решите сделать это, мы рекомендуем сохранить точность не менее 6, чтобы избежать проблем с округлением в браузере.

Autoprefixer

Bootstrap использует Autoprefixer (включён в наш процесс сборки), чтобы автоматически добавлять префиксы вендоров к некоторым свойствам CSS во время сборки. Это экономит время и код, позволяя нам писать ключевые части CSS один раз, исключая необходимость использования миксинов вендоров, как в v3.

Мы поддерживаем список поддерживаемых браузеров через Autoprefixer в отдельном файле в нашем репозитории GitHub. Смотрите .browserslistrc для получения подробной информации.

RTLCSS

Bootstrap использует RTLCSS для обработки скомпилированного CSS и преобразования его в RTL — в основном заменяя свойства, учитывающие горизонтальное направление (например, padding-left) на их противоположности. Это позволяет нам написать наш CSS только один раз и внести незначительные изменения, используя управляющие директивы и директивы значений RTLCSS.

Локальная документация

Запуск нашей документации локально требует использования Hugo, который устанавливается через npm-пакет hugo-bin. Hugo — это чрезвычайно быстрый и достаточно расширяемый статический генератор сайтов, который предоставляет нам: базовые включения, файлы на основе Markdown, шаблоны и многое другое. Вот как запустить его:

1. Пройдите настройку средств разработки (выше), чтобы установить все зависимости.
2. Из корневого каталога /bootstrap запустите npm run docs-serve в командной строке.
3. Откройте http://localhost:9001/ в вашем браузере, и вуаля.

Узнайте больше об использовании Hugo, прочитав его документацию.

Отладка

В случае проблем с установкой зависимостей, удалите все предыдущие версии зависимостей (глобальные и локальные). Затем, повторно запустите npm install.