geekday’s diary

超絶初心者のエンジニアがいろいろなプログラミング言語に挑戦してみるブログです。

Ruby on Railsで特定ページのみCSS,JavaScriptを読み込ませる

以前記載した件の続きのような話になるがメモ。

Railsで特定ページのみ指定のCSSJavaScriptを読み込ませたい場合はrequire_freeをコメントアウトするが、その続き。

 

keruuweb.com

上記のページが極めてわかりやすかったので参考にする。

ここでいうstep1は上述のrequire_freeなのでとばし、step2から着手する。

config/initializers/assets.rb 

内に、指定のJSファイルをプリコンパイル対象に含める以下記述を行う。

Rails.application.config.assets.precompile += %w( tops/*.js ) 

※ここでは、assest/JavaScript直下にtopsフォルダを作製、その中のjsファイルは全てプリコンパイル対象としている。なお、用意したファイルはtop.jsの1ファイル。

 

そのあとで、view側には以下を記載する。

<%= javascript_include_tag "tops.js" %>

 

これでめでたくJSファイルを読み込むことができた。もしできない場合は一旦サーバを再起動してみるとよいかもしれない。

cssも同様で、assetsファイルに

Rails.application.config.assets.precompile += %w( tops.css )

 と記述。

view側には

<%= stylesheet_link_tag "tops", :media => "all" %>

と記載。これで無事読み込まれることになる。

なお、環境によって違うのかもしれないが、自分のローカル環境ではcss読み込みの際に再度サーバを立ち上げてくださいとエラーが出てきたので(develop環境でも必要・・?)その通りに従って再起動した結果、無事出来た。

 

余談だが、今回cssをいじったついでに画像ファイルの読み込みも行ったのだが、railsの場合画像パスがassets/image内であっても、assets/画像ファイル名(フォルダでまとめている場合はassets/フォルダ名/画像ファイル名)とする必要があってちょっと戸惑った。