Seiichi Yonezawa — How creativity is helped by failure

自分を鑑みるとき

少々大げさなタイトルですが、今日は自分の力を過信しすぎているかもなという出来事がありました。それはデプロイ時のことなのですが、普段開発ではあまり気にかけないアセットのことです。現に、このサイトもbootstrap等のライブラリはgemを利用していました。つまり、外部のライブラリは使い方がわかっているようで、そんなにわかっていないのでした。

今回、slickというライブラリを拝借しました。JavaScriptのライブラリではCSSとJSがそれぞれ分かれていることも珍しくないため、下記のようなディレクトリ構造を採用しました。この形式だと、ライブラリを置き換える時にディレクトリ構造を書き換えずにそのまま上書きできるわけです。

vendor/
└── assets
    ├── javascripts
    ├── slick
    │   └── slick
    └── stylesheets

この例では、vendor/slick/slick/slick.cssvendor/slick/slick/slick.jsがあり、目的のファイルまで階層が深いです。このファイルをimportあるいはrequireするのにconfig/initializers/assets.rbRails.application.config.assets.pathsにパスを追加します。そして、開発環境で無事リンクできていることを確認できたのでstaging環境へプッシュ。すると、このライブラリだけ404エラーが表示されるではありませんか。

似たような現象で、TinyMCEも元々npmからインストールしていたのですが、結局gemに乗り換えました。しかし、今回はちゃんと原因を探してみようと思いました。殊勝な環境なので、このサイトのように管理権限がないのでなかなかやりにくいでしたが、サーバ担当者からいただいたログを見てみると、ファイルそのものが存在していないことに気づきました。

つまり、先ほどのRails.application.config.assets.pathsではなく、Rails.application.config.assets.precompileに追加し直してheadタグから直接リンクする形式に変えました。こうしてみるとそんなに難しくはないのですが、そこに至るまではassetsのどこかにリンクを書き換えれば読み込めるはずだと思っていました。それに、アセットごときに時間を取られてなるものかと高を括っていたのもよくありませんでしたね。一度こうだと思い込んだら、それからしばらく思考停止になっていても気づけない。

Railsは便利ですし、おそらくどの言語よりも簡単です。けれども、簡単にするためには然るべき場所に正しいコードを当てはめるだけの知識が必要です。たかがアセット、されどアセット。結構焦ってしまいましたが終わりはあっさりと。日々の研鑽は重要ですね。Webpackとかyarnもそういえば勉強しないとなあ。