Как использовать потрясающие в шрифте 4 с базовыми направляющими 6 и Webpacker, без любых дополнительных драгоценных камней, вставляющего копию шрифта или файлов CSS в Ваше приложение и выполнение других странных вещей:

Добавляют потрясающий в шрифте npm пакет — package.json:

{
  "dependencies": {
    "font-awesome": "4.7.0"
  }
}

Включают потрясающий в шрифте файл CSS в †декларации CSS” app/stylesheets/application.css:

/*
 *= require font-awesome/css/font-awesome.min
 *= require_tree .
 *= require_self
 */

определение поверхности шрифта Переопределения в нашем пользовательском файле CSS — app/stylesheets/font-awesome.css.erb:

@font-face {
  font-family: 'FontAwesome';
  src: url('<%= font_path('fontawesome-webfont.eot') %>');
  src: url('<%= font_path('fontawesome-webfont.eot') %>?#iefix') format('embedded-opentype'), url('<%= font_path('fontawesome-webfont.woff2') %>') format('woff2'), url('<%= font_path('fontawesome-webfont.woff') %>') format('woff'), url('<%= font_path('fontawesome-webfont.ttf') %>') format('truetype'), url('<%= font_path('fontawesome-webfont.svg') %>#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

Включают node_modules потрясающий в шрифте dir + типы файла шрифтов в активы pipeline— config/initializers/assets.rb

Rails.application.config.assets.paths << Rails.root.join('node_modules/font-awesome/fonts')
Rails.application.config.assets.precompile << /\.(?:svg|eot|woff|ttf)\z/

, Вы будете включать шрифты и скомпилированный в каталог общественности/шрифтов, и Вы получите единственный файл CSS со всем материалом (Ваше приложение и потрясающий в шрифте) скомпилированный в него.

вещь, потрясающая в шрифте уменьшенная CSS содержит пути hardcoded к шрифтам и переопределять это мы просто добавляющая директива поверхности шрифта со сгенерированными путями шрифтов. Из-за этого шрифт-awesome.min.css должен быть добавлен сначала в файле манифеста.

Однако, в то время как все будет хорошо работать, Вы получите 404 ошибки в консоли. Мной не управляли для фиксации этого и в конечном счете сдался и переключился на font-awesome-sass драгоценный камень.