Прихлоп 4 - миграция технологии glyphicons?

можно использовать Шрифт Удивительным и Гитхаб Octicons в качестве бесплатной альтернативы для технологии glyphicons.

Bootstrap 4 также переключился с Less на Sass, поэтому вы можете интегрировать Sass шрифта (SCSS) в процесс сборки, чтобы создать один файл CSS для ваших проектов.

Также см. https://getbootstrap.com/docs/4.1/getting-started/build-tools/ чтобы узнать, как настроить ваш инструменты:

1. Загрузите и установите узел, который мы используем для управления нашими зависимостями.
2. перейдите к корневой /bootstrap каталог и выполните команду npm install для установки наших локальных зависимостей, перечисленных в пакете.формат JSON.
3. установите Ruby, установите Bundler с gem install bundler, и, в конце концов bundle install. Это установит все зависимости Ruby, такие как Jekyll и плагины.

Шрифт Удивительным

1. скачать файлы по адресуhttps://github.com/FortAwesome/Font-Awesome/tree/fa-4
2. скопировать font-awesome/scss папка в папку / bootstrap

3. откройте SCSS /bootstrap/bootstrap.scss и запишите следующий код SCSS в конце этого файла:

   $fa-font-path: "../fonts"; @import "../font-awesome/scss/font-awesome.scss";

4. обратите внимание, что вы также должны скопировать файл шрифта из font-awesome/fonts до dist/fonts или любая другая общая папка, установленная $fa-font-path в предыдущем шаг

5. Run:npm run dist чтобы перекомпилировать код с помощью шрифта-Awesome

Гитхаб Octicons

1. загрузите файлы по адресу https://github.com/github/octicons/
2. скопировать в своем /bootstrap папку

3. откройте SCSS /bootstrap/bootstrap.scss и запишите следующий код SCSS в конце этого файл:

   $fa-font-path: "../fonts"; @import "../octicons/octicons/octicons.scss";

4. обратите внимание, что вы также должны скопировать файл шрифта из font-awesome/fonts до dist/fonts или любая другая общая папка, установленная $fa-font-path на предыдущем шаге

5. Run:npm run dist для перекомпиляции кода с помощью Octicons

технологии glyphicons

на сайте Bootstrap вы можете прочитать:

включает в себя более 250 символов в формате шрифта в Glyphicon Набор халфлингов. Технологии glyphicons Халфлинги, как правило, не предоставляются бесплатно, но их создатель сделал их доступными для бесплатной загрузки стоимости. В качестве благодарности, мы только просим, чтобы вы включили ссылку на технологии glyphicons, когда это возможно.

как я понимаю, вы можете использовать эти 250 глифов бесплатно ограничено для Bootstrap, но не ограничивается версией 3 exclusive. Так что вы можете использовать их для Bootstrap 4 тоже.

1. скопируйте файлы шрифтов из: https://github.com/twbs/bootstrap-sass/tree/master/assets/fonts/bootstrap
2. копировать https://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_glyphicons.scss файл в ваш bootstrap/scss папку

3. откройте scss / bootstrap / bootstrap.scss и запишите следующий код SCSS в конце этого файла:

   $bootstrap-sass-asset-helper: false; $icon-font-name: 'glyphicons-halflings-regular'; $icon-font-svg-id: 'glyphicons_halflingsregular'; $icon-font-path: '../fonts/'; @import "glyphicons";

4. Run:npm run dist перекомпиляция ваш код с глифами

---

обратите внимание, что Bootstrap 4 требует post CSS Autoprefixer для компиляции. Когда вы используете статический компилятор Sass для компиляции CSS, вам нужно будет запустить Autoprefixer после этого.

вы можете узнать больше о смешивании с Bootstrap 4 SCSS в здесь.

вы также можете использовать Bower для установки шрифтов выше. Использование шрифта Bower Awesome устанавливает ваш файлы в bower_components/components-font-awesome/ также обратите внимание, что GitHub Octicons устанавливает octicons/octicons/octicons-.scss в качестве основного файла в то время как вы должны использовать octicons/octicons/sprockets-octicons.scss.

все вышеперечисленное скомпилирует весь ваш CSS-код в том числе в один файл, который требует только одного HTTP-запроса. В качестве альтернативы вы также можете загрузить шрифт-удивительный шрифт из CDN, который может быть слишком быстрым во многих ситуациях. Оба шрифта на CDN также включают файлы шрифтов (используя data-uri, возможно, не поддерживается для старых браузеров). Поэтому рассмотрим, какое решение лучше всего подходит для вашей ситуации в зависимости от других браузеров для поддержки.

для шрифта Awesome вставьте следующий код в <head> раздел HTML вашего сайта:

<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

попробовать генератор Yeoman, чтобы вырубить передний конец Bootstrap 4 веб-приложение чтобы проверить Bootstrap 4 с шрифтом Awesome или GitHub Octicons.