多国语关联 element

d2-admin.babel

@@ -15,6 +15,31 @@
     <folder_node>
         <name></name>
         <children>
+            <concept_node>
+                <name>_element</name>
+                <definition_loaded>false</definition_loaded>
+                <description></description>
+                <comment></comment>
+                <default_text></default_text>
+                <translations>
+                    <translation>
+                        <language>en-US</language>
+                        <approved>false</approved>
+                    </translation>
+                    <translation>
+                        <language>ja-JP</language>
+                        <approved>false</approved>
+                    </translation>
+                    <translation>
+                        <language>zh-CHS</language>
+                        <approved>false</approved>
+                    </translation>
+                    <translation>
+                        <language>zh-CHT</language>
+                        <approved>false</approved>
+                    </translation>
+                </translations>
+            </concept_node>
             <concept_node>
                 <name>_name</name>
                 <definition_loaded>false</definition_loaded>

src/i18n.js

@@ -7,13 +7,17 @@ Vue.use(VueI18n)
 function loadLocaleMessages () {
   const locales = require.context('./locales', true, /[A-Za-z0-9-_,\s]+\.json$/i)
   const messages = {}
-  locales.keys().forEach(key => {
+  for (const key of locales.keys()) {
     const matched = key.match(/([A-Za-z0-9-_]+)\./i)
     if (matched && matched.length > 1) {
       const locale = matched[1]
-      messages[locale] = locales(key)
+      const localeElementUI = require(`element-ui/lib/locale/lang/${locales(key)._element}`)
+      messages[locale] = {
+        ...locales(key),
+        ...localeElementUI ? localeElementUI.default : {}
+      }
     }
-  })
+  }
   return messages
 }
 
@@ -24,8 +28,10 @@ Vue.prototype.$languages = Object.keys(messages).map(langlage => ({
   value: langlage
 }))
 
-export default new VueI18n({
+const i18n = new VueI18n({
   locale: util.cookies.get('lang') || process.env.VUE_APP_I18N_LOCALE,
   fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE,
   messages
 })
+
+export default i18n

src/locales/en.json

@@ -1,4 +1,5 @@
 {
+	"_element": "en",
 	"_name": "English",
 	"page": {
 		"demo": {

src/locales/ja.json

@@ -1,4 +1,5 @@
 {
+	"_element": "ja",
 	"_name": "日本語",
 	"page": {
 		"demo": {

src/locales/zh-chs.json

@@ -1,4 +1,5 @@
 {
+	"_element": "zh-CN",
 	"_name": "简体中文",
 	"page": {
 		"demo": {

src/locales/zh-cht.json

@@ -1,4 +1,5 @@
 {
+	"_element": "zh-TW",
 	"_name": "繁體中文",
 	"page": {
 		"demo": {

src/plugin/d2admin/index.js

@@ -7,6 +7,8 @@ import 'flex.css'
 import '@/components'
 // svg 图标
 import '@/assets/svg-icons'
+// 国际化
+import i18n from '@/i18n.js'
 
 // 功能插件
 import pluginError from '@/plugin/error'
@@ -27,7 +29,9 @@ export default {
     // 构建时间
     Vue.prototype.$buildTime = process.env.VUE_APP_BUILD_TIME
     // Element
-    Vue.use(ElementUI)
+    Vue.use(ElementUI, {
+      i18n: (key, value) => i18n.t(key, value)
+    })
     // 插件
     Vue.use(pluginError)
     Vue.use(pluginLog)