feat(localization): element-ui localization

html/src/app.js

@@ -12,7 +12,6 @@ import VueLazyload from 'vue-lazyload';
 import VueI18n from 'vue-i18n';
 import {DataTables} from 'vue-data-tables';
 import ElementUI from 'element-ui';
-import locale from 'element-ui/lib/locale/lang/en';
 import {v4 as uuidv4} from 'uuid';
 import * as workerTimers from 'worker-timers';
 import 'default-passive-events';
@@ -127,8 +126,18 @@ speechSynthesis.getVoices();
         timeout: 6000
     });
 
+    Vue.use(VueI18n);
+
+    var i18n = new VueI18n({
+        locale: 'en',
+        fallbackLocale: 'en',
+        messages: localizedStrings
+    });
+
+    var $t = i18n.t.bind(i18n);
+
     Vue.use(ElementUI, {
-        locale
+        i18n: (key, value) => i18n.t(key, value)
     });
 
     var removeFromArray = function (array, item) {
@@ -207,16 +216,6 @@ speechSynthesis.getVoices();
 
     Vue.use(DataTables);
 
-    Vue.use(VueI18n);
-
-    var i18n = new VueI18n({
-        locale: 'en',
-        fallbackLocale: 'en',
-        messages: localizedStrings
-    });
-
-    var $t = i18n.t.bind(i18n);
-
     var $appDarkStyle = document.createElement('link');
     $appDarkStyle.disabled = true;
     $appDarkStyle.rel = 'stylesheet';
@@ -6418,10 +6417,7 @@ speechSynthesis.getVoices();
     };
 
     $app.methods.promptTOTP = function () {
-        this.$prompt(
+        this.$prompt($t('prompt.totp.description'), $t('prompt.totp.header'), {
-            $t('prompt.totp.description'),
-            $t('prompt.totp.header'),
-            {
             distinguishCancelAndClose: true,
             cancelButtonText: $t('prompt.totp.use_otp'),
             confirmButtonText: $t('prompt.totp.verify'),
@@ -6445,15 +6441,11 @@ speechSynthesis.getVoices();
                     this.promptOTP();
                 }
             }
-            }
+        });
-        );
     };
 
     $app.methods.promptOTP = function () {
-        this.$prompt(
+        this.$prompt($t('prompt.otp.description'), $t('prompt.otp.header'), {
-            $t('prompt.otp.description'),
-            $t('prompt.otp.header'),
-            {
             distinguishCancelAndClose: true,
             cancelButtonText: $t('prompt.otp.use_otp'),
             confirmButtonText: $t('prompt.otp.verify'),
@@ -6477,8 +6469,7 @@ speechSynthesis.getVoices();
                     this.promptTOTP();
                 }
             }
-            }
+        });
-        );
     };
 
     $app.methods.promptEmailOTP = function () {
@@ -11793,14 +11784,25 @@ speechSynthesis.getVoices();
     };
 
     $app.methods.changeFavoriteGroupName = function (ctx) {
-        this.$prompt($t('prompt.change_favorite_group_name.description'), $t('prompt.change_favorite_group_name.header'), {
+        this.$prompt(
+            $t('prompt.change_favorite_group_name.description'),
+            $t('prompt.change_favorite_group_name.header'),
+            {
                 distinguishCancelAndClose: true,
-            cancelButtonText: $t('prompt.change_favorite_group_name.cancel'),
+                cancelButtonText: $t(
-            confirmButtonText: $t('prompt.change_favorite_group_name.change'),
+                    'prompt.change_favorite_group_name.cancel'
-            inputPlaceholder: $t('prompt.change_favorite_group_name.input_placeholder'),
+                ),
+                confirmButtonText: $t(
+                    'prompt.change_favorite_group_name.change'
+                ),
+                inputPlaceholder: $t(
+                    'prompt.change_favorite_group_name.input_placeholder'
+                ),
                 inputValue: ctx.displayName,
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.change_favorite_group_name.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.change_favorite_group_name.input_error'
+                ),
                 callback: (action, instance) => {
                     if (action === 'confirm') {
                         API.saveFavoriteGroup({
@@ -11809,14 +11811,17 @@ speechSynthesis.getVoices();
                             displayName: instance.inputValue
                         }).then((args) => {
                             this.$message({
-                            message: $t('prompt.change_favorite_group_name.message.success'),
+                                message: $t(
+                                    'prompt.change_favorite_group_name.message.success'
+                                ),
                                 type: 'success'
                             });
                             return args;
                         });
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.clearFavoriteGroup = function (ctx) {
@@ -13465,12 +13470,17 @@ speechSynthesis.getVoices();
     };
 
     $app.methods.promptUserIdDialog = function () {
-        this.$prompt($t('prompt.direct_access_user_id.description'), $t('prompt.direct_access_user_id.header'), {
+        this.$prompt(
+            $t('prompt.direct_access_user_id.description'),
+            $t('prompt.direct_access_user_id.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.direct_access_user_id.ok'),
                 cancelButtonText: $t('prompt.direct_access_user_id.cancel'),
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.direct_access_user_id.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.direct_access_user_id.input_error'
+                ),
                 callback: (action, instance) => {
                     if (action === 'confirm' && instance.inputValue) {
                         var testUrl = instance.inputValue.substring(0, 15);
@@ -13480,7 +13490,9 @@ speechSynthesis.getVoices();
                                 this.showUserDialog(userId);
                             } else {
                                 this.$message({
-                                message: $t('prompt.direct_access_user_id.message.error'),
+                                    message: $t(
+                                        'prompt.direct_access_user_id.message.error'
+                                    ),
                                     type: 'error'
                                 });
                             }
@@ -13489,61 +13501,85 @@ speechSynthesis.getVoices();
                         }
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptUsernameDialog = function () {
-        this.$prompt($t('prompt.direct_access_username.description'), $t('prompt.direct_access_username.header'), {
+        this.$prompt(
+            $t('prompt.direct_access_username.description'),
+            $t('prompt.direct_access_username.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.direct_access_username.ok'),
                 cancelButtonText: $t('prompt.direct_access_username.cancel'),
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.direct_access_username.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.direct_access_username.input_error'
+                ),
                 callback: (action, instance) => {
                     if (action === 'confirm' && instance.inputValue) {
                         this.lookupUser({displayName: instance.inputValue});
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptWorldDialog = function () {
-        this.$prompt($t('prompt.direct_access_world_id.description'), $t('prompt.direct_access_world_id.header'), {
+        this.$prompt(
+            $t('prompt.direct_access_world_id.description'),
+            $t('prompt.direct_access_world_id.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.direct_access_world_id.ok'),
                 cancelButtonText: $t('prompt.direct_access_world_id.cancel'),
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.direct_access_world_id.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.direct_access_world_id.input_error'
+                ),
                 callback: (action, instance) => {
                     if (action === 'confirm' && instance.inputValue) {
                         if (!this.directAccessWorld(instance.inputValue)) {
                             this.$message({
-                            message: $t('prompt.direct_access_world_id.message.error'),
+                                message: $t(
+                                    'prompt.direct_access_world_id.message.error'
+                                ),
                                 type: 'error'
                             });
                         }
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptAvatarDialog = function () {
-        this.$prompt($t('prompt.direct_access_avatar_id.description'), $t('prompt.direct_access_avatar_id.header'), {
+        this.$prompt(
+            $t('prompt.direct_access_avatar_id.description'),
+            $t('prompt.direct_access_avatar_id.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.direct_access_avatar_id.ok'),
                 cancelButtonText: $t('prompt.direct_access_avatar_id.cancel'),
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.direct_access_avatar_id.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.direct_access_avatar_id.input_error'
+                ),
                 callback: (action, instance) => {
                     if (action === 'confirm' && instance.inputValue) {
                         var testUrl = instance.inputValue.substring(0, 15);
                         if (testUrl === 'https://vrchat.') {
-                        var avatarId = this.parseAvatarUrl(instance.inputValue);
+                            var avatarId = this.parseAvatarUrl(
+                                instance.inputValue
+                            );
                             if (avatarId) {
                                 this.showAvatarDialog(avatarId);
                             } else {
                                 this.$message({
-                                message: $t('prompt.direct_access_avatar_id.message.error'),
+                                    message: $t(
+                                        'prompt.direct_access_avatar_id.message.error'
+                                    ),
                                     type: 'error'
                                 });
                             }
@@ -13552,7 +13588,8 @@ speechSynthesis.getVoices();
                         }
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptOmniDirectDialog = function () {
@@ -13570,7 +13607,9 @@ speechSynthesis.getVoices();
                         var input = instance.inputValue;
                         if (!this.directAccessParse(input)) {
                             this.$message({
-                                message: $t('prompt.direct_access_omni.message.error'),
+                                message: $t(
+                                    'prompt.direct_access_omni.message.error'
+                                ),
                                 type: 'error'
                             });
                         }
@@ -13702,13 +13741,18 @@ speechSynthesis.getVoices();
     };
 
     $app.methods.promptNotificationTimeout = function () {
-        this.$prompt($t('prompt.notification_timeout.description'), $t('prompt.notification_timeout.header'), {
+        this.$prompt(
+            $t('prompt.notification_timeout.description'),
+            $t('prompt.notification_timeout.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.notification_timeout.ok'),
                 cancelButtonText: $t('prompt.notification_timeout.cancel'),
                 inputValue: this.notificationTimeout / 1000,
                 inputPattern: /\d+$/,
-            inputErrorMessage: $t('prompt.notification_timeout.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.notification_timeout.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -13725,17 +13769,23 @@ speechSynthesis.getVoices();
                         this.updateVRConfigVars();
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptPhotonOverlayMessageTimeout = function () {
-        this.$prompt($t('prompt.overlay_message_timeout.description'), $t('prompt.overlay_message_timeout.header'), {
+        this.$prompt(
+            $t('prompt.overlay_message_timeout.description'),
+            $t('prompt.overlay_message_timeout.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.overlay_message_timeout.ok'),
                 cancelButtonText: $t('prompt.overlay_message_timeout.cancel'),
                 inputValue: this.photonOverlayMessageTimeout / 1000,
                 inputPattern: /\d+$/,
-            inputErrorMessage: $t('prompt.overlay_message_timeout.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.overlay_message_timeout.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -13752,11 +13802,15 @@ speechSynthesis.getVoices();
                         this.updateVRConfigVars();
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptRenameAvatar = function (avatar) {
-        this.$prompt($t('prompt.rename_avatar.description'), $t('prompt.rename_avatar.header'), {
+        this.$prompt(
+            $t('prompt.rename_avatar.description'),
+            $t('prompt.rename_avatar.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.rename_avatar.ok'),
                 cancelButtonText: $t('prompt.rename_avatar.cancel'),
@@ -13772,23 +13826,31 @@ speechSynthesis.getVoices();
                             name: instance.inputValue
                         }).then((args) => {
                             this.$message({
-                            message: $t('prompt.rename_avatar.message.success'),
+                                message: $t(
+                                    'prompt.rename_avatar.message.success'
+                                ),
                                 type: 'success'
                             });
                             return args;
                         });
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptChangeAvatarDescription = function (avatar) {
-        this.$prompt($t('prompt.change_avatar_description.description'), $t('prompt.change_avatar_description.header'), {
+        this.$prompt(
+            $t('prompt.change_avatar_description.description'),
+            $t('prompt.change_avatar_description.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.change_avatar_description.ok'),
                 cancelButtonText: $t('prompt.change_avatar_description.cancel'),
                 inputValue: avatar.ref.description,
-            inputErrorMessage: $t('prompt.change_avatar_description.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.change_avatar_description.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -13799,18 +13861,24 @@ speechSynthesis.getVoices();
                             description: instance.inputValue
                         }).then((args) => {
                             this.$message({
-                            message: $t('prompt.change_avatar_description.message.success'),
+                                message: $t(
+                                    'prompt.change_avatar_description.message.success'
+                                ),
                                 type: 'success'
                             });
                             return args;
                         });
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptRenameWorld = function (world) {
-        this.$prompt($t('prompt.rename_world.description'), $t('prompt.rename_world.header'), {
+        this.$prompt(
+            $t('prompt.rename_world.description'),
+            $t('prompt.rename_world.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.rename_world.ok'),
                 cancelButtonText: $t('prompt.rename_world.cancel'),
@@ -13826,23 +13894,31 @@ speechSynthesis.getVoices();
                             name: instance.inputValue
                         }).then((args) => {
                             this.$message({
-                            message: $t('prompt.rename_world.message.success'),
+                                message: $t(
+                                    'prompt.rename_world.message.success'
+                                ),
                                 type: 'success'
                             });
                             return args;
                         });
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptChangeWorldDescription = function (world) {
-        this.$prompt($t('prompt.change_world_description.description'), $t('prompt.change_world_description.header'), {
+        this.$prompt(
+            $t('prompt.change_world_description.description'),
+            $t('prompt.change_world_description.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.change_world_description.ok'),
                 cancelButtonText: $t('prompt.change_world_description.cancel'),
                 inputValue: world.ref.description,
-            inputErrorMessage: $t('prompt.change_world_description.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.change_world_description.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -13853,24 +13929,32 @@ speechSynthesis.getVoices();
                             description: instance.inputValue
                         }).then((args) => {
                             this.$message({
-                            message: $t('prompt.change_world_description.message.success'),
+                                message: $t(
+                                    'prompt.change_world_description.message.success'
+                                ),
                                 type: 'success'
                             });
                             return args;
                         });
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptChangeWorldCapacity = function (world) {
-        this.$prompt($t('prompt.change_world_capacity.description'), $t('prompt.change_world_capacity.header'), {
+        this.$prompt(
+            $t('prompt.change_world_capacity.description'),
+            $t('prompt.change_world_capacity.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.change_world_capacity.ok'),
                 cancelButtonText: $t('prompt.change_world_capacity.cancel'),
                 inputValue: world.ref.capacity,
                 inputPattern: /\d+$/,
-            inputErrorMessage: $t('prompt.change_world_capacity.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.change_world_capacity.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -13881,23 +13965,31 @@ speechSynthesis.getVoices();
                             capacity: instance.inputValue
                         }).then((args) => {
                             this.$message({
-                            message: $t('prompt.change_world_capacity.message.success'),
+                                message: $t(
+                                    'prompt.change_world_capacity.message.success'
+                                ),
                                 type: 'success'
                             });
                             return args;
                         });
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptChangeWorldYouTubePreview = function (world) {
-        this.$prompt($t('prompt.change_world_preview.description'), $t('prompt.change_world_preview.header'), {
+        this.$prompt(
+            $t('prompt.change_world_preview.description'),
+            $t('prompt.change_world_preview.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.change_world_preview.ok'),
                 cancelButtonText: $t('prompt.change_world_preview.cancel'),
                 inputValue: world.ref.previewYoutubeId,
-            inputErrorMessage: $t('prompt.change_world_preview.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.change_world_preview.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -13916,19 +14008,25 @@ speechSynthesis.getVoices();
                                 }
                             } catch {
                                 this.$message({
-                                message: $t('prompt.change_world_preview.message.error'),
+                                    message: $t(
+                                        'prompt.change_world_preview.message.error'
+                                    ),
                                     type: 'error'
                                 });
                                 return;
                             }
                         }
-                    if (instance.inputValue !== world.ref.previewYoutubeId) {
+                        if (
+                            instance.inputValue !== world.ref.previewYoutubeId
+                        ) {
                             API.saveWorld({
                                 id: world.id,
                                 previewYoutubeId: instance.inputValue
                             }).then((args) => {
                                 this.$message({
-                                message: $t('prompt.change_world_preview.message.success'),
+                                    message: $t(
+                                        'prompt.change_world_preview.message.success'
+                                    ),
                                     type: 'success'
                                 });
                                 return args;
@@ -13936,7 +14034,8 @@ speechSynthesis.getVoices();
                         }
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.promptMaxTableSizeDialog = function () {
@@ -13986,7 +14085,9 @@ speechSynthesis.getVoices();
                 cancelButtonText: $t('prompt.photon_lobby_timeout.cancel'),
                 inputValue: this.photonLobbyTimeoutThreshold / 1000,
                 inputPattern: /\d+$/,
-                inputErrorMessage: $t('prompt.photon_lobby_timeout.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.photon_lobby_timeout.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&
@@ -22675,24 +22776,32 @@ speechSynthesis.getVoices();
     };
 
     $app.methods.promptNewLocalWorldFavoriteGroup = function () {
-        this.$prompt($t('prompt.new_local_favorite_group.description'), $t('prompt.new_local_favorite_group.header'), {
+        this.$prompt(
+            $t('prompt.new_local_favorite_group.description'),
+            $t('prompt.new_local_favorite_group.header'),
+            {
                 distinguishCancelAndClose: true,
                 confirmButtonText: $t('prompt.new_local_favorite_group.ok'),
                 cancelButtonText: $t('prompt.new_local_favorite_group.cancel'),
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.new_local_favorite_group.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.new_local_favorite_group.input_error'
+                ),
                 callback: (action, instance) => {
                     if (action === 'confirm' && instance.inputValue) {
                         this.newLocalWorldFavoriteGroup(instance.inputValue);
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.newLocalWorldFavoriteGroup = function (group) {
         if (this.localWorldFavoriteGroups.includes(group)) {
             $app.$message({
-                message: $t('prompt.new_local_favorite_group.message.error', { name: group }),
+                message: $t('prompt.new_local_favorite_group.message.error', {
+                    name: group
+                }),
                 type: 'error'
             });
             return;
@@ -22707,12 +22816,21 @@ speechSynthesis.getVoices();
     };
 
     $app.methods.promptLocalWorldFavoriteGroupRename = function (group) {
-        this.$prompt($t('prompt.local_favorite_group_rename.description'), $t('prompt.local_favorite_group_rename.header'), {
+        this.$prompt(
+            $t('prompt.local_favorite_group_rename.description'),
+            $t('prompt.local_favorite_group_rename.header'),
+            {
                 distinguishCancelAndClose: true,
-            confirmButtonText: $t('prompt.local_favorite_group_rename.save'),
+                confirmButtonText: $t(
-            cancelButtonText: $t('prompt.local_favorite_group_rename.cancel'),
+                    'prompt.local_favorite_group_rename.save'
+                ),
+                cancelButtonText: $t(
+                    'prompt.local_favorite_group_rename.cancel'
+                ),
                 inputPattern: /\S+/,
-            inputErrorMessage: $t('prompt.local_favorite_group_rename.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.local_favorite_group_rename.input_error'
+                ),
                 inputValue: group,
                 callback: (action, instance) => {
                     if (action === 'confirm' && instance.inputValue) {
@@ -22722,13 +22840,17 @@ speechSynthesis.getVoices();
                         );
                     }
                 }
-        });
+            }
+        );
     };
 
     $app.methods.renameLocalWorldFavoriteGroup = function (newName, group) {
         if (this.localWorldFavoriteGroups.includes(newName)) {
             $app.$message({
-                message: $t('prompt.local_favorite_group_rename.message.error', { name: newName }),
+                message: $t(
+                    'prompt.local_favorite_group_rename.message.error',
+                    {name: newName}
+                ),
                 type: 'error'
             });
             return;
@@ -22826,7 +22948,9 @@ speechSynthesis.getVoices();
                 cancelButtonText: $t('prompt.pending_offline_delay.cancel'),
                 inputValue: this.pendingOfflineDelay / 1000,
                 inputPattern: /\d+$/,
-                inputErrorMessage: $t('prompt.pending_offline_delay.input_error'),
+                inputErrorMessage: $t(
+                    'prompt.pending_offline_delay.input_error'
+                ),
                 callback: (action, instance) => {
                     if (
                         action === 'confirm' &&

html/src/localization/localizedStrings.js

@@ -1,5 +1,10 @@
 import en from './strings/en.json' assert {type: 'JSON'};
+import elements_en from 'element-ui/lib/locale/lang/en';
 // import ja from './strings/ja.json' assert { type: 'JSON' };
 import zh_TW from './strings/zh_TW.json' assert {type: 'JSON'};
+import elements_zh_TW from 'element-ui/lib/locale/lang/zh-TW';
 
-export {en, zh_TW};
+const localized_en = {...en, ...elements_en};
+const localized_zh_TW = {...zh_TW, ...elements_zh_TW};
+
+export {localized_en as en, localized_zh_TW as zh_TW};

html/src/vr.js

@@ -10,7 +10,6 @@ import Noty from 'noty';
 import Vue from 'vue';
 import VueI18n from 'vue-i18n';
 import ElementUI from 'element-ui';
-import locale from 'element-ui/lib/locale/lang/en';
 import * as workerTimers from 'worker-timers';
 import MarqueeText from 'vue-marquee-text-component';
 import * as localizedStrings from './localization/localizedStrings.js';
@@ -40,7 +39,7 @@ Vue.component('marquee-text', MarqueeText);
     });
 
     Vue.use(ElementUI, {
-        locale
+        i18n: (key, value) => i18n.t(key, value)
     });
 
     var escapeTag = (s) =>