

## 環境

  * Ruby 2.6.3
  * Ruby on Rails 6.0.0
  * Yarn 1.22.4
  * Webpacker 5.1.1
  * @fortawesome/fontawesome-free 5.13.0

## 問題

記事（<https://techracho.bpsinc.jp/hachi8833/2020_01_17/85943>）の通りにRailsにYarnでFontawesomeパッケージを導入し、以下のように設定しました。

**application.scss**

[code]

    $fa-font-path: '@fortawesome/fontawesome-free/webfonts';
    @import '@fortawesome/fontawesome-free/scss/fontawesome';
    @import '@fortawesome/fontawesome-free/scss/regular';
    @import '@fortawesome/fontawesome-free/scss/solid';
    @import '@fortawesome/fontawesome-free/scss/brands';
    
[/code]

**application.js**

[code]

    require("@fortawesome/fontawesome-free")
    
[/code]

開発環境（localhost:3000）では、Chrome開発コンソールとターミナル上にエラーは出ず、絵文字も表示されました。しかし、実行環境では、絵文字が
□ のように表示され、以下の通りのエラーが出ました。

**Chrome コンソール**

[code]

    Failed to load resource: the server responded with a status of 404 (Not Found) fa-solid-900.woff2:1
    Failed to load resource: the server responded with a status of 404 (Not Found) fa-solid-900.woff:1
    Failed to load resource: the server responded with a status of 404 (Not Found) fa-solid-900.tff:1
    
[/code]

**ターミナル**

[code]

    ActionController::RoutingError (No route matches [GET] "/assets/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff"):
    ...
    
[/code]

なぜ開発環境では絵文字が表示され、実行環境では表示されないのか分かりません。

初学者ですので、下らない質問ではあると存じますが、どうかお願い致します。


CC BY-SA 4.0
2020-04-29T03:26:39.443
66093
2020-05-01T03:40:05.607
36658
question
ruby-on-rails webpack yarn
Rails6で、実行環境時にFont Awesomeの絵文字が四角に表示される


config/environments/production.rb で `config.assets.compile = true`
とすることで解決しました。


CC BY-SA 4.0
2020-05-01T03:40:05.607
66171
2020-05-01T03:40:05.607
36658
66093
answer