MomentJS with react languages

Question

I'm using moment JS with React and I have a problem with changing language. When I type moment.lang('pl') or moment.locale('pl') and then moment.format('MMMM') it only shows month in english. Is there any way to fix it?

Code

import React, {Component} from 'react'; import moment from 'moment'; class Time extends Component { constructor(props) { super(props); this.state = {} } render() { let march = moment(); moment.lang('pl'); console.log(march.format('MMMM')); return ( <div> <div className="time"> <br/> </div> </div> ) } } export default Time;

Natsathorn · Accepted Answer · 2017-07-28 20:17:00Z

The problem is you set the languege after you get the time.

To fix it just swap the line like this :

import 'moment/locale/pl'// add this line below your moment import moment.lang('pl'); let march = moment();

Also this is an example that I try before answer you.

import moment from 'moment'; import 'moment/locale/pl' let a = moment(); moment.locale('pl') let b = moment(); console.log(a.format('MMMM')); //July console.log(b.format('MMMM')); //lipiec

Actually, moment.lang is deprecated after version 2.8.0 (For Yarn or NPM this seems to deprecated since 2.10 that i tried). If you use later version, please use moment.locale instead.

more information here : http://momentjs.com/docs/#/i18n/

It still shows me July in console log but it also shows me an error moment.min.js:1 Uncaught SyntaxError: Unexpected token < I am on moment.js in version 2.18
@KonradUciechowski Then you're not transpiling w/ anything that recognizes JSX.
@KonradUciechowski check you jsx transpiler like webpack or something else.
@Natsathorn I don't know what is wrong with my app but in my case I just copy paste your solution and in my case it shows "July" two times instead of "July" "Lipiec"
@Natsathorn also I created simple html and test your solution on just simple html, It still shows me "July" two times instead of "July" "Lipiec"

Guilherme · Accepted Answer · 2019-12-24 02:55:34Z

Just adding to Natsathorn's answer, you can import it dynamically with

import(`moment/locale/${navigator.language.toLocaleLowerCase()}`).then();

Collectives™ on Stack Overflow

MomentJS with react languages

2 Answers 2

7 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Related