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

Ruby on Rails自分用備忘録

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

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

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

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

@import 'modules/invoice'
@import 'modules/slider-pro'

//独自に追加した
@import 'test_css/testcss'

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

body

  background: green

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

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