webpack-dev-server

参考:

webpacker/webpack-dev-server.md at 3-x-stable · rails/webpacker – GitHub

Rails 5.1 で CSS を webpack-dev-server によって HMR (ライブリロード) させる – Qiita

pretty

true に設定すると、webpacker-dev-server においてコンパイルの進捗を表示する。(webpacker.yml 内で設定)

pretty: true

webpack-dev-server --progress --color で起動するのと同じになる。

参考:

Customizing Logging – webpacker/webpack-dev-server.md at 3-x-stable · rails/webpacker – GitHub

extract_css?

true の場合は Webpack でスタイルシートをバンドルする際に CSS ファイルとして抽出される。(webpacker.yml 内で設定)

参考:

extract_css? – webpacker/configuration.rb at v4.0.7 · rails/webpacker – GitHub

dev_server

Webpacker::DevServer のインスタンスを返す。

参考:

dev_server – webpacker/instance.rb at v4.0.7 · rails/webpacker – GitHub

dev_server.running?

webpack-dev-server が起動されている場合に true を返す。

参考:

running? – webpacker/dev_server.rb at v4.0.7 · rails/webpacker – GitHub

devtool

ソースマップの設定

development 環境のデフォルト設定

devtool: 'cheap-module-source-map'

production 環境のデフォルト設定

devtool: 'source-map'

参考:

devtool – webpacker/development.js at v4.0.7 · rails/webpacker – GitHub

devtool – webpacker/production.js at v4.0.7 · rails/webpacker – GitHub

Devtool | Webpack [Official]

デバッグ

インスペクタを接続してデバッグを行う。(node コマンドに --inspect-brk を付けて起動することに相当する。)

$ bin/webpack-dev-server --debug

参考:

Debugging your webpack config – webpacker/troubleshooting.md at v4.0.7 · rails/webpacker – GitHub

Webpacker::DevServer

参考:

webpacker/dev_server.rb at v4.0.7 · rails/webpacker – GitHub

Webpacker::DevServerRunner

参考:

webpacker/dev_server_runner.rb at v4.0.7 · rails/webpacker – GitHub

タグ:

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です