パーフェクトRuby on Rails 増補改訂版 4章、webpackerについて

パーフェクトRuby on Rails 増補改訂版 4章のwebpackerについてまとめ

パーフェクト Ruby on Rails 【増補改訂版】 (Perfect series)

webpacker

webpackerはwebpackをRailsから扱いやすくするラッパー

app/javascript/packs/application.jsがエントリーファイルとなる。 以下のコマンドでエントリーファイルをもとにビルドを実行

$ bin/rails webpacker:compile

public/packs/js配下にファイルが出力される。 出力したファイルはapp/views/layout/application.html.erbで読み込まれている

config/webpacker.ymlにて環境ごとの設定を行える。

Webpackが提供してないloaderやpluginを追加したい場合や、config/webpacker.ymlで設定できる範囲外のことをしたい場合はconfig/webpack/*.jsを修正する。 例 config/webpack/development.js の場合

process.env.NODE_ENV = process.env.NODE_ENV || 'development' // ①

const environment = require('./environment') // ②

module.exports = environment.toWebpackConfig() // ③

①でdevelopment環境を設定し
②で、config/webpacker.ymlに定義された設定などを読み込んでいる。
③でwebpackの設定用JSONを出力する。
なので、config/webpacker.ymlの範囲外は、③の前に設定すれば、webpack設定用JSONを出力してくれる。

webpack-dev-serverでのビルド

webpack-dev-serverコマンドを使うとwebpack管理下のファイルの更新を検知してすぐにビルドしてくれる。

$ bin/webpack-dev-server

assets:precompile実行時にもwebpackerのビルドが行われる。 RAILS_ENVで環境をproductionしてからassets:precompileを行わないとファイル内のプログラムは縮小されない。

production環境でのpublicディレクトリ

Railsではproduction環境ではpublicディレクトリ以下のファイルは読み込まない。 nginxなどでpublic以下を配信するのが正しい構成。環境変数RAILS_SERVE_STATIC_FILESに値が何かしら入っていればRails自身で配信する。