Posted on by 256hax

Rails5 app/assets、lib/asses、vendor/assetsの使い分け

Rails v 5.2.2.

・app/assetsはアプリ全体として共通管理するもの（app/assets/javascripts/application.jsとか）やアプリ固有のもの（app/assets/javascripts/posts.coffeeとか）を置く
・lib/assetsは自作コードを置く（特定のviewだけxxのファイルを読み込みたい、みたいな時はここに置いて読み込む？ここ以外に最適そうなとこがない）
・vendor/assetsはサードパーティ（外部ベンダーが提供したもの、bootstrapとか）を置く

---Railsガイドからの引用---

  • app/assetsは、カスタム画像ファイル、JavaScript、スタイルシートなど、アプリケーション自身が保有するアセットの置き場所です。
  • lib/assetsは、1つのアプリケーションの範疇に収まらないライブラリのコードや、複数のアプリケーションで共有されるライブラリのコードを置く場所です。
  • vendor/assetsは、JavaScriptプラグインやCSSフレームワークなど、外部の団体などによって所有されているアセットの置き場所です。

引用元：アセットパイプライン | Rails ガイド

■外部ベンダー提供のjs, CSSを読み込む場合の例
外部ベンダーの bootstrap-tagsinput.min.js と bootstrap-tagsinput.cssを読み込みたいとする。

１．vendor/assets/javascripts/bootstrap-tagsinput.min.js と vendor/assets/stylesheets/bootstrap-tagsinput.css にファイル置く

２．config/initializers/assets.rb に以下を定義する

vendor/assets/配下にパスを通す。assetsは記述しないこと。

Rails.application.config.assets.paths << Rails.root.join('vendor', 'stylesheets')
Rails.application.config.assets.paths << Rails.root.join('vendor', 'javascripts')

読み込むファイルを指定する。ワイルドカードなども使用可能。

Rails.application.config.assets.precompile += [
'bootstrap-tagsinput.min.js',
'bootstrap-tagsinput.css'
]

３．railsを再起動する
４．読み込みたいviewで、stylesheet_link_tag と javascript_include_tag を使って定義したファイルを読み込む