[VUE] Scheduler localization with Vue

[doonamis]

Hello I'm following this steps to localize Scheduler in a Vue environment

https://www.bryntum.com/docs/scheduler/#guides/customization/localization.md

How do I apply this to Vue?

Currently I've tried:

import {Scheduler, LocaleManager} from 'bryntum-vue-shared/src/Scheduler.vue';
import SvSE from '~/scheduler-2.2.5/build/locales/scheduler.locale.SvSE.js';

But LocalManager doesn't exist on vue component for scheduler

Thanks!

[saki]

Have you seen our Vue Localization demo?

[doonamis]

Hello Saki,

Sorry I didn't found it before, it was really helpfull

The thing is we've translated all the app with vue i18n so it would be nice if we can integrate this tool with bryuntum also, currently we're following the tutorial but we're stuck on the point to register some locales

import SvSE from '~/scheduler-2.2.5/build/locales/scheduler.locale.SvSE.js'
LocaleManager.registerLocale('SvSE', { locale : SvSE });

This line results in a warning:

"export 'default' (imported as 'SvSE') was not found in '~/scheduler-2.2.5/build/locales/scheduler.locale.SvSE.js' 

After that is we try to set the locale like this:

LocaleManager.locale = 'svSE'

Then we get this error:

Locale svSE not registered

I've doublechecked the path and it's right, could it be due the version of the scheduler? Or maybe I'm pointing to the wrong file?

Thanks!

[saki]

This line results in a warning:

import SvSE from '~/scheduler-2.2.5/build/locales/scheduler.locale.SvSE.js'
// ...
"export 'default' (imported as 'SvSE') was not found in '~/scheduler-2.2.5/build/locales/scheduler.locale.SvSE.js' 

It is weird that the basic import does not work. It can be cause by a wrong path: what is ~ translated to during the Vue runtime? Try to copy the locale to the project tree and then try the relative path.

It can also be the version of Scheduler (least possible) so you can try to upgrade to 3.1.1.

In any case, the first thing to fix is that import.

[doonamis]

Hello Saki,

I'm checking, but the path seems ok, I have all the bryntum files inside the "scheduler-2.2.5" folder and I'm importing other files and component with the "~" without problem on this same page, but I'll try now to do it with the relative path

Here's the start of the file I'm importing (I don't include the full of it as it's really large

/*

Bryntum Scheduler 2.3.0
Copyright(c) 2019 Bryntum AB
https://bryntum.com/contact
https://bryntum.com/license

*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():

Thanks!

[saki]

I have tested the following:

1. I have used full version of 2.2.5 scheduler. (Your code above refers to both 2.2.5 and 2.3.0 versions, both seem to be non-trials, your license in the forum says expired trial so update your license please.)
2. I've added the following lines to examples/vue/javascript/simple/src/App.vue:
       import { LocaleManager } from 'bryntum-scheduler';
       import SvSE from 'bryntum-scheduler/locales/scheduler.locale.SvSE.js';
   
       LocaleManager.locale = SvSE;
   

3. I've added line scheduler.locale.* to .eslintignore
4. run npm i && npm run serve

and it works as expected:

Screen Shot 2020-04-07 at 09.47.06.png (103.97 KiB) Viewed 1484 times