webpack, babel, node環境で例外時のスタックトレースに元ソースの場所を表示させる
問題
nodeに読み込ませるソースをwebpackとbabelでコンパイルするようにすると,エラー時のスタックトレースがat Object.eval (webpack-internal:///76:29:7)のような意味不明なものになってしまいます.
これはソースマップを有効にしていても起きてしまいます.
webpackのissueにも既にこの問題は報告されていましたが.
｢source mapはブラウザが読み込むものだからnodeは取り扱わないよ｣とownerにすげなく言われています.
解決法
evanw/node-source-map-support: Adds source map support to node.js (for stack traces)を使います.
これをインストールしてエントリーポイントに
と書きます.
それでここからが重要なのですが.webpackが吐き出すsource mapを-dで指定されるeval-cheap-module-source-mapからinline-source-mapに切り替えます.
つまりwebpack -dではなくwebpack --debug --devtool inline-source-mapでビルドしないといけません.そうしないとnode-source-map-supportはソースマップを認識してくれません.これで1時間ぐらいハマりました.
設定に成功していればスタックトレースはat Object.<anonymous> (/home/ncaq/Desktop/foobar/dist/webpack:/src/main.js:17:7)のように元のソースの位置を含むものに変わっているはずです.