(TypeScriptで書かれてWebpackでビルドされた) CloudFunctionsのエラー通知をわかりやすくしてみた

やりたいこと

stack driver error reportのエラーの内容をもう少しわかりやすくしたい。

やること

ここを参考に node-sourcemap-supportを導入した。

ここを見ると、Firebaseでは index.js.map も一緒にdeployできると書いてあるが、cloud functions単体ではそういった記述を確認できなかったので、少し古いが上記のtopicに書かれていた通りの方法で実装した。serverless frameworkじゃなくても上手くいくか分からなかったがとりあえず試してみて、上手くいった。

具体的な変更内容

npm install source-map-support

src/index.ts

// この一行を追加
import "source-map-support/register";

webpack.config.js

module.exports = {
  ...
  devtool: 'source-map', //<= これを追加
  ...
}

これだけ。

結果

stack driver error traceで見たエラーメッセージを比較する。

before

ReferenceError: atob is not defined
at t.HistoryAppender (index.js:593)
at t.history_appender (index.js:424)
at (/worker/worker.js:756)
at <anonymous>
at process._tickDomainCallback (next_tick.js:228)

どこのコードで問題があったのか全くわからない。

after

ReferenceError: atob is not defined
at parse (/srv/webpack:/node_modules/@google-cloud/bigquery/src/index.js:5)
at t.history_appender (index.ts:49)
at (/worker/worker.js:756)
at <anonymous>
at process._tickDomainCallback (next_tick.js:228)

index.ts: 49行目の処理に問題があることがわかるようになった。

その他メモ

• どのくらい深い階層まで追えるのかまだ分かっていない
• build後のファイルサイズが大きくなっている訳ではない

// before
ls -alh index.js
-rw-r--r--  1 shuhei.morioka  staff   5.5M 11 12 21:24 index.js

// after
ls -alh index.js
-rw-r--r--  1 shuhei.morioka  staff   5.5M 11 12 21:15 index.js

他に良い方法をご存知の方いれば教えてください〜