Cloud9-RoR-jQuery套版

參考文章(1)：http://openhome.cc/Gossip/Rails/Layout.html
參考文章(2)：http://openhome.cc/Gossip/Rails/Assets.html
輔助文章(1)：https://ihower.tw/rails4/assets-pipeline.html
輔助文章(2)：http://guides.rubyonrails.org/asset_pipeline.html
輔助文章(3)：http://api.rubyonrails.org/v3.0.9/classes/ActionView/Helpers/AssetTagHelper.html
輔助文章(2)-簡中：http://guides.ruby-china.org/asset_pipeline.html

因為我目前的打算是每頁都有屬於自己的版面功能，所以這篇是介紹怎麼替單獨的頁面套上jQuery版型。很多範例都是加在app/assets裡，但這樣會套用到所有的頁面，跟我要的不一樣，結果又花了好多時間研究…

在rails中，可以放js及css檔的地方其實有三個，輔助文章(1)裡面有做仔細的說明，因為我是要使用jQuery，所以放在vendor/assets裡。

在目錄處找到vendor/assets，將jQuery中的js檔及css檔分別放入javascripts和stylesheets folder中，不過為預防日後還會使用到不同的jQuery會混淆不清，所以我們先在javascripts和stylesheets的folder底下新增一個這次要使用的jQuery folder名稱，名稱建議取相同的，才知道是同一組jQuery的檔案，然後新增兩個檔案。

新增一個同樣名稱的js檔放在vendor/assets/javascripts，例如myjQuery.js

//= require_tree .

新增一個同樣名稱的css檔放在vendor/assets/stylesheets，例如myjQuery.css

 /*
 = require_tree .
*/

如果jQuery會使用到圖檔，請在vendor/assets下方建立一個images folder，一樣在images底下新增同名的folder，把會使用到的圖片上傳至此folder中。css檔裡的圖檔連結請一定要照規定寫，否則會找不到圖片哦！

我是將會使用到圖片的該隻css檔，副檔改為scss，只要有image連結的部份都一律改為「image-url」(括弧內一定要加雙引號，否則會出錯)

background-image: image-url("myjQuery/rails.png")

打開這次要套用jQuery的html.erb檔，我習慣將套件放在最下方

.
.
.
<!-- css //-->
<%= stylesheet_link_tag 'myjQuery' %>

<!-- jquery //-->
<%= javascript_include_tag 'myjQuery' %>

編輯config/initializers/assets.rb(我是使用rails4.2，config.assets.precompile已被移入assets.rb裡了，寫在config/environments/production.rb裡沒用哦！)

Rails.application.config.assets.precompile += %w( myjQuery.js myjQuery.css )
Rails.application.config.assets.precompile += %w( *.png *gif *.jpg )

註：第二行是我的css裡會用到的圖檔類型，如果你有用到其他更多類型的檔案(不一定是圖檔)，可以自行加上*.你會用的檔案副檔名。

這樣就套版完成嘍！