React moment locale 적용하기 🌹

React에서 moment를 사용하는 경우 locale을 변경하고자 하면 직접 import 해주어야 합니다.

import moment from 'moment'
import 'moment/locale/fr';
import 'moment/locale/kr';

export default function App(){
  생략
}

 

moment는 시간을 다룰때 굉장히 유용한 library 입니다.

그래서 굉장히 널리 사용되고 있습니다.

 

moment는 파일사이즈가 큽니다. 

그래서 day.js와 같이 파일사이즈가 작고 moment와 쓰임새가 유사한 라이브러리를 사용하라는 정보를 접한적이 있습니다.

 

cra로 시작한 경우 moment의 locale을 변경해주려면 위와 같이 locale file을 직접 import 해주어야 합니다.

moment의 locale은 file size가 너무 커서 cra의 webpack 설정에서 exclude 되었습니다.

그래서 위와 같이 import 해주지 않으면 기본 locale인 영어만 default로 사용 가능합니다.

 

아래에 cra에서 moment 관련하여 코멘트 된 부분의 링크를 첨부하였습니다.

https://github.com/facebook/create-react-app/pull/2187/files

Ignore Moment.js locales by default by gaearon · Pull Request #2187 · facebook/create-react-app

 

 

출처: https://stackoverflow.com/questions/49788259/moment-js-change-locale-not-working

moment.js change locale not working