Ruby on rails を学習中の方の参考にしてもらえたら嬉しいです。
今回はアプリケーションを作成している時に出てくるエラーとその解決方法について掲載します。少しでも参考にしていただけると幸いです。
まず最初にcouldn't find file 'trix/dist/trix' with type 'text/css"
というエラーの解決方法をお話しします。
▼エラーの紹介
今回のエラーはaction text を使ってテキスト入力をリッチにデコレーションするためのrich textを導入していく過程でCSSを読み込まなくなってしまったエラーです。
上のエラー画面のようにcouldn't find file 'trix/dist/trix' with type 'text/css" Checked in these paths:
というエラーが出ていますので、これを解決していきます。
▼結論から
このエラーの解決策はcssファイルが入っている stylesheets の actiontext.cssの中にある//=-require trix/dist/trix
という行を消すとcssがうまく読み込まられるようになりました。では、この消すまでの過程を見ていきます。
▼エラーの原因を探ります
下の画像を見てください。エラーの原因が書いてあります。“trix/dist/trix”という名前のCSSファイルを見つけられないときに発生しますと書いてあります。
注意
※ここで注意したいのはChatGPTは解決方法の1つを提示してくれているだけで、この解決方法が正しくないことがあります。今回はこの解決方法で解決できましたが、開発の順序やスペックによっては、今回の方法で解決しない場合があります。
▼まずはactiontextをインストールします
画像にある通り、Rails6にはデフォルトで入っているらしいでの、Gemfileを確認してactiontextが入っているか確認してください。無ければインストールです。
▼次にactiontextをインストールして、マイグレーションしていきます
画像の半分から下に書いてあるようにmodeleにhas_rich_text:contentを入れます。
▼インストールしてマイグレーションすると...
▼マイグレーションが成功するとdbにフォルダが追加されます
▼最後にactiontextのcssファイルを変更
画像のように//=-require trix/dist/trix
の行を削除するとcssが読み込まれてブラウザが正しく表示されました。
▼最後に
今回のエラーはcssを読み込まなくなってしまったことを解決するための記事なので、rich_textを導入するためにはこれだけの作業では足りません。テキストの保存場所を変えたり、他の作業(コード)が必要です。
導入のための作業は別途確認してください。
いかがでしたでしょうか?
他にも記事を発信していきますので、私の QiitaやTwitterをフォローしていただけると嬉しいです。
個別の質問もぜひ歓迎します。
私自身、初学者ではありますが、1歩先を行くものとして回答できたらと思います。
それでは。