Vercelで"pino-pretty"を実行して"Application error: ..."になる場合の解決策

こんにちは。株式会社SasaTech 代表の佐々木です。

Next.jsでWEBアプリケーションを開発しており、loggerとしてpinoを使用していました。
https://github.com/pinojs/pino/tree/main

ログを見やすくしようと、「pino-pretty」を導入し、Vercelにデプロイを行うと、ビルドは成功するがURLを開くとApplication errorが発生してしまう状況が発生しました。

解決方法

Vercelのシステム環境変数を使用して、Vercelにデプロイされているかを判断を行う処理をついかしました。
具体的には、Vercelにデプロイされている場合にpino-prettyを使用しないようにします。

Vercelの環境変数はSystem Environment Variables Overviewを参照しました。

コード

logger.ts

export const logger = pino({
  // Vercelの環境変数によってログの出力先を変更
  transport: process.env.VERCEL ? undefined : {
    target: 'pino-pretty',
    options: { colorize: true }
  },
  browser: {
    asObject: true,
  },
  timestamp: pino.stdTimeFunctions.isoTime,
});