タイトル通り

Rails 6.1.4.6でEC2にデプロイするとprecompileでエラーが発生します。

もちろんrails sしてもエラーで表示されないです。

結論

解決方法としてはCDNを使うのが一番手っ取り早いです。

なのでapplication.html.erbに下記を入れるのが一番早いです。

<link rel ="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">

すでに入れてしまっているものは削除してください。

webpackerでやってしまった場合

webpackerの場合はapplication.js, application.scssに記載しているだろう

@import '~bootstrap/scss/bootstrap';

と

import '@fortawesome/fontawesome-free/js/all'

を削除します。

gemでやってしまった場合

gemの場合はGemfileから下記font-awesome-sassを削除してscssからも削除してください。

gem 'font-awesome-sass'

@import "font-awesome-sprockets";
@import "font-awesome";

どうしてもやりたい場合

webpackerの場合はapplication.jsは共通で問題ないです。

import '@fortawesome/fontawesome-free/js/all';

application.scssがdevelopの場合は下記のようにimportする必要があり、

@import '~@fortawesome/fontawesome-free/scss/fontawesome';

productionの場合、下記のようにする必要があります。

$fa-font-path: '@fortawesome/fontawesome-free/webfonts';
@import '@fortawesome/fontawesome-free/scss/fontawesome';
@import '@fortawesome/fontawesome-free/scss/solid';
@import '@fortawesome/fontawesome-free/scss/regular';
@import '@fortawesome/fontawesome-free/scss/brands';
@import '@fortawesome/fontawesome-free/scss/v4-shims';

でないとdevelop版では表示されずcssが途中までしか読み込まれないのでstylesheetも設定されずproductionの場合はprecompileでエラーになります。

ただしapplication.js/application.scssなのでdevelop, productionを切り替えるのは容易ではないのでおとなしくCDNを使った方がよいです。

個人的にはjsやcssは依存関係に縛られないCDNを使う方がよいと思っています。