Vagrant内部で webpack --watchを有効にする

前のブログの再掲です。

以下本文

---

Vagrantの内部でコマンドの実行自体はできるのだけど、 普通に実行しても初回のコンパイルのみ実行されて、 その次のファイル変更を自動で検知してコンパイルしてくれない。 これはめんどくさい。

チームメンバーにwebpack云々だとか、nodeの構築はあんまりやらせたくない事情もあって、なんとかしたい。

未解決なIssueがあって、

https://github.com/webpack/webpack/issues/425

その中に

Afaik VirtualBox doesn't (and will not) provide a mechanism to watch on file changes. It's only possible to poll for changes which has its own limitations.

But we're discussing about a new watching solution here. There's also a known issue regarding VMs and timestamps of files.)

と記載されていて、

正しい訳かどうかわからんけど、

「Vagrantのファイル変更のメカニズムがWebPackの変更を検知するメカニズムと違っており、 変更しているかどうかを拾えない。」

ということを言っているのだと思う。

このIssueは未だに未解決になっているし、検索してもなかなか対策が出てこない。

ドキュメントを参考にして、WebpackのWatchOptionでpollオプションを有効にすることにした。

https://webpack.github.io/docs/configuration.html#watchoptions-poll

module.exports.watchOptions = {
  aggregateTimeout: 300,
  poll: 1000
}

pollの値をtrueにしても動くのだけど、ポーリングし過ぎで、CPUの使用率がずっと100％とかになっちゃうので、 poll 1000とかにして、1秒おきにポーリングするようにしないと使いものになら無いので注意が必要。

とりあえず、vagrantの中でwebpackのコンパイルができるようになったので、一安心。