Next.jsでSentryにソースマップを送信する

こんにちは、株式会社スタメンで FANTS の開発をしている@0906kokiです。 今回は Next.js のアプリケーションに Sentry を組み込む方法と、ソースマップを送信して Sentry 上でトランスパイル前のコードでエラー箇所を見れる方法について書きたいと思います。 Sentry とは？ Sentry とは、エラートラッキングサービスで、アプリケーション上で発生したエラーの内容、ユーザー、ブラウザ情報等を通知することができるサービスです。類似サービスとしては Bugsnag や Datadog 等がありますね。 React や Vue などは、トランスパイルをして圧縮、難読化された JavaScript のコードに変換すると思いますが、トランスパイル後のコードでエラー発生箇所を通知しても、エラートラックすることは難しいです。 なので、Sentry に対してソースマップファイ