Moment.jsからDay.jsに切り替える

投稿日

2020.10.13

Moment.jsという日付を扱うのに特化したjsのライブラリがメンテナンスモードになったため、代替えとして上げられる Day.js に以降する事にしました。

検証した環境

経緯

2020年の9月にMoment.jsがメンテナンスモードに入る事が発表されました。 Moment.jsがメンテナンスモードへーー新機能開発は行わず | OSDN Magazine

Moment.jsは日付を扱うjsのパッケージの中でデファクトスタンダードになっていたイメージで、実際乗り換え先と言われる、Day.js や Luxon.js よりメンテナンスモードに入る事が発表され1ヶ月経った今でもはるかにダウンロードされています。

ただ、いろんな理由があってメンテナンスモードに入る、という事で今後の事を考えると別のパッケージを使った方がいいな、と。

私が今回必要とした機能としては、

という要件でした。

軽量で以前の職場の同僚の方からおすすめされていた事もありDay.jsを使ってみる事にしました。

先にday.jsをインストールします。TypeScriptだとしても以下の1行でOKです！

$ yarn add dayjs

文字列（ex: 2020-10-13 09:53:43）から指定したフォーマットの日付の文字列を取得するのは以下のようになります。

Moment.jsの場合

import moment from 'moment'
 
export const formatDate = (str: string) => {
  return moment(str).format('YYYY.MM.DD')
}

Day.jsの場合

import dayjs from 'dayjs'
 
export const formatDate = (str: string) => {
  return dayjs(str).format('YYYY.MM.DD')
}

ほぼ構文一緒でいけますね！

注意点としては公式を見るとTypeScript版は以下のように import を行う、と書いていますが、

import * as dayjs from 'dayjs'
dayjs().format()

私の環境だと ↑ の書き方をすると dayjs in not a function と怒られてしまいました。

ドキュメントを見るタイミングが良くなかったかな？

まだMoment.jsが残っている状態なので削除します

削除前の確認

$ npm ls --depth=0 | grep moment
15:├── moment@2.28.0

削除を実行

$ yarn remove moment

削除後の確認

$ npm ls --depth=0 | grep moment
# => 何も表示されなくなる

参考資料

Yuki Takara

都内でフリーランスのエンジニアをやってます。フロントとアプリ開発メインに幅広くやってます。