Railsのアセットパイプラインとやらは長年私を苦しめてきました。なぜアセットをpublicに置かずにapp/assetsなどというディレクトリに置かなければならないのか。webpackじゃだめなんですか？(webpackerについてはよく知りません)
私がいかに完全に理解したかをできるだけシンプルに共有したいと思います。
- アセットとは次のものである
- 画像ファイル(gif, jpg, png)
- スクリプトファイル(js, coffee, es6)
- スタイルシート(css, scss, sass)
- アセットは次のディレクトリ以下に置く。サブフォルダを作って入れてもよい
- app/assets/*/
- vendor/assets/*/
- 実際に利用するためには、適当なアセットファイルに利用したいファイルをリンクするディレクティブを書く必要がある！
言いたかったのは最後のやつだけです。このルールに気づくのにだいぶ時間がかかった。
//= link foo.js
//= link_directory ../stylesheets .css
//= link_tree ../images
こういう指定をアセットとして読み込ませたい単位で適当なアセットファイルに記述します。マニフェストファイルと呼ばれたりしますが、あくまでアセットファイルの一つにすぎません。上から、
- どこかのアセットディレクトリにあるfoo.jsまたはfoo.jsになりうるファイル
- マニフェストファイルからの相対パス指定によるディレクトリ以下のcssファイルすべて
- マニフェストファイルからの相対パス指定によるディレクトリ以下のアセットファイルすべて(サブディレクトリ以下も再帰的に含む)
という指定になります。
マニュアルをみると、読み込みたいファイルをいちいちRails.application.config.assets.pathsに追加しなければいけないように見えますし、実際そのようにしてきましたが、この仕組みを理解していればその必要がないことがわかると思います。泣く泣くapplication.jsやapplication.cssにすべてを記述していた人も多いのではないのでしょうか。
他にも依存関係指定やトランスパイルなど便利な機能が揃っていますが、このことを知らないと話にならない。
今はwebpackerとやらが主流なんでしょうが、まだ触れる機会はあると思います。