技術ログ

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

2018年9月9日

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を全てのファイルでシェアするのは、良いことなんだろうか。わからない、わからない、わからない。

Pocket
LinkedIn にシェア

エンジニアにおすすめできる本

Card image cap
リーダブルコード

より良いコードを書くためのシンプルで実践的なテクニック

Card image cap
Webを支える技術

HTTP,URI,HTML,そしてREST

Card image cap
誰でもPythonで作れる

儲かるAIとソフトウェアの作り方

Card image cap
プログラマが知るべき97のこと

現場で使える実践哲学のマスターピース

Card image cap
情熱プログラマー

時代を超えて。ソフトウェア開発者の幸せな生き方

Card image cap
アジャイルサムライ

プログラミング達人開発者への道

Card image cap
Rubyを作った男 まつもとゆきひろ

コードの世界 スーパー・プログラマになる14の思考法

ご提供 sponsor
 

Meee!(ミー)は、ビジネスからプライベート利用まで、個人のスキルを気軽に売り買いできるスキルマーケットです。カテゴリや居住地から、検索することが可能です。

 

ランゲージエクスチェンジは、ネイティブスピーカーと気軽にマッチングできる言語交換プラットフォームです。あなたの地元に住む外国人を探したり、留学や海外移住の前に、現地のネイティブスピーカーと繋がることもできます!

宣伝
 

りょすけトークchは、仕事や私生活をより豊にするYouTubeチャンネルです。文献(本、映画、論文)から役に立つ情報をまとめ、生涯にわたり役に立つ哲学をお届けしています。是非、チャンネル登録してみてね

-技術ログ

Copyright© offブログ! , 2021 All Rights Reserved Powered by AFFINGER5.