TechFeedTechFeed
🔍
라이브러리난이도 쉬움⏱ 1~2시간

Moment.js에서 Day.js로 마이그레이션

Moment.js→Day.js
요약: Day.js는 Moment와 거의 동일한 API에 번들 크기는 약 2KB로, import만 바꾸면 대부분 그대로 동작합니다. timezone·duration 등은 플러그인을 추가합니다.

왜 옮기나

  • Moment.js는 공식적으로 유지보수 모드(legacy)로 신규 권장 대상이 아닙니다.
  • Moment는 번들이 크고(수십 KB) tree-shaking이 어렵습니다.
  • Day.js는 2KB 수준에 Moment 호환 API를 제공합니다.

전제 — 현재 상태

moment 패키지 사용, moment() 호출, format/add/diff 등 사용.

마이그레이션 단계

1
Day.js 설치, Moment 제거

Day.js를 설치하고 Moment를 제거합니다.

npm uninstall moment
npm install dayjs
2
import와 호출 교체

moment를 dayjs로 바꿉니다. 기본 format/add/subtract/diff는 호환됩니다.

// before: import moment from 'moment'; moment().format('YYYY-MM-DD')
import dayjs from 'dayjs'
dayjs().format('YYYY-MM-DD')
3
필요한 플러그인 추가

timezone·duration·relativeTime·customParseFormat 등은 Day.js 플러그인으로 분리돼 있어 명시적으로 등록합니다.

import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone'
dayjs.extend(utc); dayjs.extend(timezone)
4
한국어 로케일

한국어 표기가 필요하면 로케일을 import해 설정합니다.

import 'dayjs/locale/ko'
dayjs.locale('ko')

⚠️ 막히는 케이스 · 함정

  • Day.js 객체는 기본 불변(immutable)입니다 — Moment처럼 원본을 변경하지 않으니 반환값을 받아야 합니다.
  • Moment 전용 메서드(일부 비표준 format 토큰)는 플러그인이나 대체 로직이 필요할 수 있습니다.
✅ 검증: 날짜 포맷·연산·타임존 표시가 기존과 일치하는지 주요 화면에서 확인하고, 번들 분석으로 크기 감소를 확인합니다.
Day.jsMoment.js날짜번들크기timezone