Почему Bootstrap включает файл начальной загрузки?

Вопрос аналогичен этому: Как использовать bootstrap-theme.css с bootstrap 3?, но не дублировать. Я взаимодействую с Bootstrap на уровне бездействия и перекомпилирую его каждый раз, когда я делаю изменения.

Как я уже сказал, я разрабатываю тему Bootstrap с less. Я редактирую биты здесь, меняя переменные. Вырезание неиспользуемых компонентов. Поместите большую часть моего нового CSS в /less/theme.less. В конце этого я остался с двумя файлами css: /dist/css/bootstrap.css и /dist/css/bootstrap-theme (ну ладно, да... и их коллеги .min.css, вы педантичные knowitall)

Какова точка разделения этого вывода на два отдельных файла? Они оба отклонились от настроек "запаса" (просто изменение less/variables.less сделает это), так что это не так дублирование усилий? Разве это не дополнительный запрос, который мы (разработчики, которые думают, что они знают лучше всего) постоянно говорят, что юниорам следует избегать любой ценой?

При разработке пользовательских тем Bootstrap это мои варианты:

Отключите включенную theme.less и включите мои изменения в основную сборку Bootstrap,
Не изменяйте ничего в построении и перезагрузке ядра в моем theme.less,
Продолжайте то, что я делаю, изменяя оба и используя два файла CSS.

Что мне делать и почему?

В соответствующей заметке, не следует ли создавать Bootstrap из файлов, которые вы получаете, если вы нажмете Download Bootstrap? Оглядываясь назад, они, похоже, направлены на построение документации Bootstrap (там тонна глупость Джекила там, где я просто канаву). Есть ли "чистая" версия Bootstrap, которая предназначена для людей, которые хотят настроить Bootstrap без документации?

Ответ 1

Я начал об этом ошибкой и получил этот ответ:

Мы не разделяем документы на другое репо, потому что это делает его намного более болезненным/сложным, чтобы поддерживать их в актуальном состоянии с изменениями кода.

Довольно жалкая ИМО, но это не мой проект. После часа прошу, я пошел с объединением первых двух вариантов. Я добавил следующую строку в bootstrap.less:

@import "theme.less";

Чтобы сделать эту работу в реальности, необходимо внести несколько изменений:

Очистите Gruntfile, чтобы остановить создание отдельной темы
Удаление импорта Bootstrap из верхней части файла theme.less(вызывает цикл, если вы этого не делаете)

Но выход по желанию. Один файл жира bootstrap.css и немного более тонкий bootstrap.min.css файл.

Мне все еще не хочется взламывать весь процесс сборки - это очень устойчивый метод использования Bootstrap в качестве стартовой темы. Очень открытые для лучших решений.

В другом проекте я сбросил окончательный импорт, и я просто выполняю всю свою работу в bootstrap.less. Конечно, есть 50 строк наверху, которые являются нагрузкой для импорта шаблонов, но это означает, что я не перескакиваю между файлами почти так же. Я знаю, что включается все время.

Я также удалил grunt и пошел с моим собственным решением для ткани, которое уже использовалось в моем существующем рабочем процессе. Как всегда, ваш пробег может отличаться. Ты не я.

Ответ 2

Bootstrap 3 применил подход к стилю умиротворенного стиля со всех своих компонентов. Это было связано с тем, что разработчикам приходилось писать стиль записи и добавлять свои собственные, что вызывало раздутый CSS. Гораздо лучше начать с плоского дизайна, который можно использовать в качестве основы и основываться на этом, как вы пожелаете.

Таким образом, входит theme.less, который является шаблоном. Это отправная точка для создания уникальной темы. Если вы включите его в свою сборку bootstrap.less, вы получите стандартную тему Bootstrap, которую мы все используем для просмотра (т.е. Слегка поднятые кнопки, градиенты и т.д.). Это в паре с вашим файлом variables.less дает вам полный контроль над стилем презентации вашего интерфейса.

Типичным рабочим процессом для использования Bootstrap с LESS является его использование с Bower. Сайт Bower объяснит, как установить беседку с помощью npm. Предположим, что вы установили боулинг, используйте свое приложение командной строки и cd into/your/root/path/. Выполните следующие действия:

bower install bootstrap --save

Bower устанавливает все пакеты в каталог bower_components/. Вы никогда не будете изменять файлы, установленные Bower. Вы должны скопировать три файла из файлов Bootstrap LESS в свою собственную папку style. Это variables.less, bootstrap.less и theme.less. Вы можете проверить мое репо. Я настроил для этого все внимание.

Скопированный файл bootstrap.less должен быть изменен, чтобы пути файлов для всех компонентов Bootstrap @import ссылались на те, которые были установлены Bower. Вы можете @import ваши копии theme.less и variables.less в bootstrap.less. Внесите изменения, как пожелаете, и скомпилируйте свою тему.

Если вы хотите обновить загрузку до последней версии, вы можете просто использовать bower для этого и внести какие-либо изменения в ваши скопированные файлы по мере необходимости, чтобы убедиться, что они соответствуют всем, что было изменено в новой версии.

Я надеюсь, что ответит на ваш вопрос.