【vercel】デプロイした時に日付がずれてしまう【タイムゾーン】

vercelで公開したサイトを確認していると、1日ずれていることに気づきました。開発環境では気づかなかったことなので、localhostでも再度チェック。また、普通にbuildしてチェック。しかし、問題はありません。ということはvercelでなにか引っ掛かってしまったのか？

調べてみると、vercelではタイムゾーンの関係で日本時間より9時間前の日付が表示されてしまっているようでした。

解決策

date-fns-tzを用います。

$ yarn add date-fns-tz
or
$ npm i date-fns-tz

また、これだけでは動かなかったので、以下もインストールしました。

$ yarn add date-fns
or
$ npm i date-fns

これを読み込み、new Date()でいつも通り日付を取得します。

import dateFnsTz from 'date-fns-tz';
const { utcToZonedTime } = dateFnsTz;

let date = utcToZonedTime(new Date(), 'Asia/Tokyo');

console.log(date.getMonth() + 1 + "月" + date.getDate() + "日")
// 今日の日付が取得できます

解決への道のり

date-fns-tzだけを使用した時、以下のようなエラーが出ました。

error - ./node_modules/date-fns-tz/esm/format/index.js:1:0
Module not found: Can't resolve 'date-fns/esm/format'

Module not found？？？今入れたけど？？？

と思いながら調べていたら英語で議論している人々に出くわしたので、母国語に変換して置いておくことにしました。終わり。