`Webpacker` で呼び出されるコードのデバックはどのようにすればよいのでしょうか？

具体的には以下のような流れで問題に直面しました。

こちらのQiitaの記事を参考にRails+Vue.jsの勉強をしていたのですが  
<https://qiita.com/naoki85/items/51a8b0f2cbf949d08b11>

記事内にもある通り`config/webpack/loaders/vue.js`にある

```

    const extractCSS = !(inDevServer && (devServer && devServer.hmr)) || isProduction
    
```

を

```

    const extractCSS = false
    
```

と書き換える必要がありました。

ただ元の記述も development 環境であれば`false`になるように見えるのに`true`になってしまっているのが気になり  
`!inDevServer`, `!devServer`,
`!devServer.hmr`を順番に`extractCSS`に代入して`!devServer.hmr`が`true`になってしまっている事まで確認しました。

ただ、毎回このように面倒な方法を取りたくないので`ruby`の`binding.pry`などのように変数の追跡を行う方法を知りたいのですが、どのように行えば良いでしょうか？
CC BY-SA 4.0
2019-01-19T17:24:22.377
52122
2019-01-19T17:24:22.377
3271
question
javascript ruby-on-rails webpack
webpacker のロード時に各変数を確認する方法