【しくじり】date-fnsのバージョンを安易に1から2系に上げたらシステムが壊れた

......ので、1から2に上げる際の既存機能への破壊的変更をまとめました。

ISO 8601形式の日付文字列の扱いの変更

バージョン1での挙動

バージョン1のコード例:

// バージョン1では、ISO 8601形式の文字列を直接関数に渡すことができました。
const date = '2019-03-30T10:00:00Z';
console.log(addDays(date, 1)); // ISO 8601形式の文字列を直接加算

バージョン2での挙動

バージョン2のコード例:

// バージョン2では、ISO 8601形式の文字列を扱うには`parseISO`関数を使用する必要があります。
import { parseISO, addDays } from 'date-fns';

const date = '2019-03-30T10:00:00Z';
const parsedDate = parseISO(date);
console.log(addDays(parsedDate, 1)); // `parseISO`を使用して日付オブジェクトに変換

対応策: ISO 8601形式の文字列を使用する場合は、parseISO関数を使用して日付オブジェクトに変換し、その後でdate-fnsの他の関数に渡すようにします。

注意点

• バージョン2では、日付文字列を直接操作する関数が削除され、parseISOを使用することが推奨されています。
• この変更は、日付の解析をより厳密にし、エラーを減らすために行われました。

引数の形式の変更

format関数の変更

バージョン1のコード例:

// バージョン1では、年を'YYYY'、日を'DD'としていました。
console.log(format(new Date(2019, 0, 1), 'YYYY-MM-DD')); // 出力: "2019-01-01"

バージョン2のコード例:

// バージョン2では、年は'yyyy'、日は'dd'となります。
console.log(format(new Date(2019, 0, 1), 'yyyy-MM-dd')); // 出力: "2019-01-01"

対応策: すべてのformat関数を見直し、フォーマット文字列を新しい仕様に合わせて更新します。

関数の挙動の変更

addDays関数のタイムゾーンの扱い

バージョン1のコード例:

// バージョン1では、タイムゾーンの影響を受ける可能性がありました。
const result = addDays(new Date('2019-03-30T10:00:00Z'), 1);
console.log(result); // タイムゾーンによっては、結果が異なる可能性があります。

バージョン2のコード例:

// バージョン2では、タイムゾーンの影響を受けずに日数を加算します。
const result = addDays(new Date('2019-03-30T10:00:00Z'), 1);
console.log(result); // タイムゾーンに関係なく、一貫した結果が得られます。

対応策: タイムゾーンに依存するコードがある場合は、その挙動を確認し、必要に応じて修正

ロケールの扱いの変更

ロケールの明示的な指定

バージョン1のコード例:

// バージョン1では、グローバルにロケールを設定
import { es } from 'date-fns/locale/es';
dateFns.locale(es); // グローバルにスペイン語ロケールを設定

バージョン2のコード例:

// バージョン2では、関数ごとにロケールを指定します。
import { format, es } from 'date-fns';
console.log(format(new Date(2019, 0, 1), 'P', { locale: es })); // 出力: "1/1/2019"

対応策: ロケールを使用する各関数に対して、明示的にロケールオプションを渡すように変更