I cannot find on the fullcalendar documentation how to set the locale for the React component ().

This is how I'm using the component:

import FullCalendar from '@fullcalendar/react' // must go before plugins
import dayGridPlugin from '@fullcalendar/daygrid' // a plugin!

export default function Calendar(props){
    
    return (
        <Box>
            <FullCalendar
            plugins={[ dayGridPlugin ]}
            initialView="dayGridMonth"
            />
        </Box>
    );

}

How can I set the language to Spanish?

I cannot find on the fullcalendar documentation how to set the locale for the React component (https://fullcalendar.io/docs/react).

This is how I'm using the component:

import FullCalendar from '@fullcalendar/react' // must go before plugins
import dayGridPlugin from '@fullcalendar/daygrid' // a plugin!

export default function Calendar(props){
    
    return (
        <Box>
            <FullCalendar
            plugins={[ dayGridPlugin ]}
            initialView="dayGridMonth"
            />
        </Box>
    );

}

How can I set the language to Spanish?

• javascript
• reactjs
• fullcalendar
• locale

2 Answers 2

The locale can be set on the Fullcalendar React component like this:

1. Run: yarn add @fullcalendar/core

2. Import the locale: import esLocale from '@fullcalendar/core/locales/es';

3. Pass the locale as a prop to the component:

    <FullCalendar locale={esLocale} plugins={[ dayGridPlugin ]} initialView="dayGridMonth" />
   

To complement the answer of Agu Dondo, you can import all languages available.

import allLocales from '@fullcalendar/core/locales-all'

And later, to the component FullCalendar, add locales and in locale use the abbreviation language like es or ca.

<FullCalendar locales={allLocales} locale={'es'} plugins={[ dayGridPlugin ]} initialView="dayGridMonth" />