Ruby on Railsで外部のcssを読み込む方法

 

Ruby on Rails自分用備忘録

Ruby on Railsの既存プロジェクトを引き継いだ。そもそもRubyもRailsも触ったことがなかったけど、フルスタックフレームワークって何ぞやってことは、概ねDjangoで理解してたし、Rubyみたいなモダン言語は別に勉強しなくても、まあなんとなく雰囲気でいけるんじゃん。言語よりフレームワークの使用を覚えるのが面倒臭かった。ほら、フルスタックフレームワークって設計者の癖がより色濃く出るじゃんね。んで、早速「ん?」ってなった箇所があったので、書き留めておこうと思う。なんでもかんでも、できることなら正確に理解した今日この頃。

どうやってcssを読み込めばいいんだろう

slimからcssを個別に読み込んでる感じ?とか思ったけど違った。slimからcssを呼び出してない。なのにcssが反映されている。なんじゃこりゃ。んで、勉強して知った。Railsでは、というか、どうやら少なくともこのプロジェクトでは、ViewLayoutapplication.html.slimというところがあり、そこはいつも書くコードを自動化するためにあるらしくて、そこに下記のように書くと …

 = stylesheet_link_tag 'application', media: 'all'

アプリ全体で共有するcssになるらしい。これはRailsの組み込み関数で、stylesheet_link_tag (詳細はRails APIを参照) を使って、application.css.sassをすべてのファイルで読み込んでいる。それで、application.css.sassで、こんな風に、自分で独自のcssを追加した。

[php]@import ‘modules/invoice’
@import ‘modules/slider-pro’

//独自に追加した
@import ‘test_css/testcss’
[/php]

んで、上記のように書いたら、独自に作ったcssが、全部のページに適応された。下記のように書けば、アプリ全体でボディの背景色が緑色になった。

[php] body

background: green
[/php] うやり方って普通なんだろうか。これじゃ、名前衝突が起きないのだろうか?名前衝突が起きないためには、普通はstylesheet_link_tagをもう少しなんとか使って、application.css.sassに、全部のcssを書いて、全てのcssを全てのファイルでシェアするのは、良いことなんだろうか。わからない、わからない、わからない。

藤沢瞭介(Ryosuke Hujisawa)
  • りょすけと申します。18歳からプログラミングをはじめ、今はフロントエンドでReactを書いたり、AIの勉強を頑張っています。off.tokyoでは、ハイテクやガジェット、それからプログラミングに関する情報まで、エンジニアに役立つ情報を日々発信しています!

未整理記事

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です