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

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

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

検証した環境

1 yarn 1.22.4
2 Moment.js 2.28.0 削除前
3 Day.js 1.9.3 導入後

経緯

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



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

https://www.npmtrends.com/luxon-vs-dayjs-vs-moment



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



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

  • 文字列(ex: 2020-10-13 09:53:43)から簡単にフォーマット変換が出来ること
  • ソートがしやすいこと

という要件でした。

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

Day.jsに切り替える

Day.jsを導入する

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

$ yarn add dayjs

Moment.jsから切り替える

文字列(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 を行う、と書いていますが、

Typescript · Day.js

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

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


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

Moment.jsを削除する

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


削除前の確認

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

削除を実行

$ yarn remove moment

削除後の確認

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

おすすめ