internationalize vue full callendar

[zoat]

I am searching the way to put vue-fullcalendar in french. Thanks

[BrockReece]

Hi @zoat, You will need to set the locale key in the fullcalendar config and import the corresponding fullcalendar locale library. I think something like this should work...

<template>
  <full-calendar :config="config" />
</template>

<script>
import 'fullcalendar/dist/locale/fr'
export default {
  data() {
    return {
      config: {
        locale: 'fr',
      },
    }
  },
}
</script>

For more details, see their official docs

[zoat]

thank for your answer I try your answer and after npm run dev

I have : Uncaught TypeError: Cannot read property 'datepickerLocale' of undefined at Object.eval (webpack-internal:///202:4) at eval (webpack-internal:///202:3)

[BrockReece]

Ok, I will have a try after lunch. It may have changed since I last looked at it.

[zoat]

thanks brockReece

[BrockReece]

So, it is working on my example app. The only difference to the code above was I had to put in a comment to keep eslint happy.

/* eslint-disable import/no-extraneous-dependencies */
import 'fullcalendar/dist/locale/fr';

[BrockReece]

What version of vue-full-calendar are you using?

[zoat]

i am using "vue-full-calendar": "^2.1.2", I create my app with vu-cli and in my main.js

Vue.config.productionTip = false; import FullCalendar from 'vue-full-calendar' / eslint-disable no-new / Vue.config.productionTip = false; new Vue({ el: '#app', router, template: '', components: { App } }) and in my component i have

and the error is

Uncaught TypeError: Cannot read property 'datepickerLocale' of undefined at Object.eval (webpack-internal:///202:4) at eval (webpack-internal:///202:3) at eval (webpack-internal:///202:4) at Object. (app.js:1944) at webpack_require (app.js:660) at fn (app.js:86) at Object.eval (webpack-internal:///163:2) at eval (webpack-internal:///163:78) at Object. (app.js:1701) at webpack_require (app.js:660)

[BrockReece]

So you are not importing the locale lib?

import 'fullcalendar/dist/locale/fr';

Unless I am missing something?

[zoat]

yes I import 'fullcalendar/dist/locale/fr and also moment js but still have [WDS] Warnings while compiling. msgWarnings @ client?cd17:144 client?cd17:147 ./node_modules/moment/src/lib/locale/locales.js Module not found: Error: Can't resolve './locale' in my-project\node_modules\moment\src\lib\locale' @ ./node_modules/moment/src/lib/locale/locales.js 65:16-60 @ ./node_modules/moment/src/lib/locale/locale.js @ ./node_modules/moment/src/moment.js @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue @ ./src/App.vue @ ./src/main.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js msgWarnings @ client?cd17:147

[BrockReece]

This is a different error... It looks like you are trying to import a file that doesn't exist. I think your moment locale import statement should look something like this...

import 'moment/src/locale/fr'

[BrockReece]

Actually, just found this in moment`s issues

https://github.com/moment/moment/issues/4216

Looks like its a problem with the 2.19.0 version of moment

[zoat]

thanks it work !!! I fix moment version in 2.18.1

[BrockReece]

Perfect. Glad I could help.