Инструменты сборки Bootstrap

Узнайте, как использовать включенные в Bootstrap сценарии npm для создания документации, компиляции исходного кода, запуска тестов и многого другого.

Настройка инструмента

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

Чтобы использовать нашу систему сборки и запускать нашу документацию локально, вам понадобится копия исходных файлов Bootstrap и Node. Выполните следующие шаги, и вы должны быть готовы к игре:

Загрузите и установите Node.js , который мы используем для управления нашими зависимостями.
Перейдите в корневой /bootstrap каталог и запустите, npm install чтобы установить наши локальные зависимости, перечисленные в package.json .

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

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

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

Задача	Описание
`npm start`	Компилирует CSS и JavaScript, создает документацию и запускает локальный сервер.
`npm run dist`	Создает `dist/` каталог с скомпилированными файлами. Требуется Sass , Autoprefixer и terser .
`npm test`	Запускает тесты локально после запуска `npm run dist`
`npm run docs-serve`	Создает и запускает документацию локально.

Autoprefixer

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

Мы храним список браузеров, поддерживаемых с помощью Autoprefixer, в отдельном файле в нашем репозитории GitHub. Подробнее см. .Browserslistrc .

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

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

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

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

Исправление проблем

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

На этой странице