先日、社内のSlackでpixivさんのブログ記事 今日から簡単！Webpacker 完全脱出ガイド がシェアされてて、『あっ、これは...弊社でもやったやつではないか。』とおもいました。Webpackerは便利なんですけどね。
本記事はこのpixivさんのポストを受けて WebpackManifest というgemを紹介します。
ラクスルでのWebpackerを辞めた経緯
- もともとWebpackerを使った管理画面プロジェクトがあった
- そこにECサイトも乗せるようなった
- package.jsonは管理画面、ECサイトで分けて管理したかった
- Webpackerは1個のpackage.json、1個のwebpackコマンド、1個のmanifest.json前提の作りなので、package.json分けて複数のwebpackビルド処理系を作りたいラクスルの用途に合わなかった => 脱Webpacker
pixivさんのブログで紹介されてるとおりで、manifest.json を Rails に組み込むための view helper が必要になったので、弊社内でも lib/ 以下に小さなライブラリを作っていました。
gem化
そして、社内で他にもRailsアプリが立ち上がりだしてきて、『そろそろ、gem化せななあ』とおもっていたところにこのpixivさんの記事でしたので、本記事執筆にあたって WebpackManifest というgemにしました。rubygemsよりインストール可能です。このgemを使うとwebpackerを使わずに webpack の webpack-manifest-plugin が出力するmanifest.jsonに従ってview helperが asset のパスやscriptaタグをrenderingしてくれるようになります。
もともとの社内にあった view helperのメソッド名よりpixivさんのメソッド名のほうが適切でしたので、ヘルパー実装部分はpixivさんの実装を参考に組み込み直しました。
使い方
- Webpacker gem のアンインストール
- 代わりになる webpack.config.js の作成
- 素のwebpackの webpack-manifest-plugin を用いて manifest.json を出力する
- WebpackManifest gemをインストールし、↑のmanifest.jsonのパスをセットする(詳細はgemの README を参照する)
- gem付属のview helperを使う
という流れになります。
不具合等ありましたらPRいただければとおもいます。
まとめ
WebpackManifest というgemを使ったWebpackerをやめる方法をご紹介しました。
ラクスルではエンジニアを絶賛募集してます
ご興味ありましたらどうぞオフィスへ遊びに来てください。
