本番環境にアセットが反映されない場合

#事象

Railsチュートリアルの5章の最後でGit push herokuしたら、追加したはずのSCSSが反映されていなかった。
しかし、ローカルにはきちんと反映されている。
ファイルの追加やコミットを忘れていたのかと思いきや、そうでもない。

#原因
実行環境によってアセットパイプラインの挙動が異なるため。


アセットパイプラインはCoffeeScript（.coffee）やSCSS（.scss）を以下のように処理する。

####1. コンパイル
.coffeeや.scssを.jsや.cssにコンパイル（変換）する。

例

user.coffee => user.js
company.coffee => company.js

user.scss => user.css
company.scss => company.css

####2. 統合
コンパイル済みの.jsや.cssを統合する。

例

user.js
company.js
 => application.js

user.css
company.css
 => application.css

####3. 圧縮
統合済みの.jsや.cssを圧縮する。
（コメントや改行、空行を除去）

####4. ダイジェスト付与
圧縮済みの.jsや.cssのファイル名にダイジェスト（ハッシュ値）を付与する。

例

application.js
 => application-x1x2x3x4x5x6x7x8x9x0.js

application.css
 => application-x1x2x3x4x5x6x7x8x9x0.css

ただし、開発環境（development）では2,3の処理を行わない。 （デバッグの際に、原因箇所の特定がしづらくなり、可読性も落ちるため） よって、開発環境と同じように本番環境（production）を動作させようとすると、.jsや.cssに正しくアクセスできない。

解決策

本番環境にデプロイする前に、.jsや.cssをプリコンパイルする。

rails assets:precompile RAILS_ENV=production

参考

Ruby on Rails 5アプリケーションプログラミング
Ruby on Rails チュートリアル