tweak: i18n config format

Author: yyx990803

docs/.vuepress/config.js

@@ -1,16 +1,20 @@
 module.exports = {
   dest: 'vuepress',
-  langs: [
-    { lang: 'en', label: 'English', path: '/', selectText: 'Languages' },
-    { lang: 'zh-CN', label: '简体中文', path: '/zh/', selectText: '选择语言' }
-  ],
-  title: {
-    '/': 'VuePress',
-    '/zh/': 'VuePress'
-  },
-  description: {
-    '/': 'Vue-powered Static Site Generator',
-    '/zh/': 'Vue 驱动的静态网站生成器'
+  langs: {
+    '/': {
+      lang: 'en-US',
+      label: 'English',
+      selectText: 'Languages',
+      title: 'VuePress',
+      description: 'Vue-powered Static Site Generator'
+    },
+    '/zh/': {
+      lang: 'zh-CN',
+      label: '简体中文',
+      selectText: '选择语言',
+      title: 'VuePress',
+      description: 'Vue 驱动的静态网站生成器'
+    }
   },
   head: [
     ['link', { rel: 'icon', href: `/logo.png` }],

lib/app/dataMixin.js

@@ -8,6 +8,11 @@ function prepare (siteData) {
       page.frontmatter = {}
     }
   })
+  if (siteData.langs) {
+    Object.keys(siteData.langs).forEach(path => {
+      siteData.langs[path].path = path
+    })
+  }
   Object.freeze(siteData)
 }
 
@@ -28,36 +33,30 @@ export default {
     $site () {
       return store.siteData
     },
-    $title () {
-      const title = this.$site.title
-      return typeof title === 'object'
-        ? title[this.$basepath]
-        : title
-    },
-    $description () {
-      const description = this.$site.description
-      return typeof description === 'object'
-        ? description[this.$basepath]
-        : description
-    },
     $langConfig () {
       const { langs } = this.$site
       let targetLang
       let defaultLang
-      (langs || []).forEach((lang, index) => {
-        if (lang.path === '/') {
-          defaultLang = langs[index]
-        } else if (this.$page.path.indexOf(lang.path) === 0) {
-          targetLang = langs[index]
+      Object.keys(langs).forEach(path => {
+        if (path === '/') {
+          defaultLang = langs[path]
+        } else if (this.$page.path.indexOf(path) === 0) {
+          targetLang = langs[path]
         }
       })
-      return targetLang || defaultLang
+      return targetLang || defaultLang || {}
+    },
+    $title () {
+      return this.$langConfig.title || this.$site.title || ''
+    },
+    $description () {
+      return this.$langConfig.description || this.$site.description || ''
     },
     $lang () {
-      return this.$langConfig && this.$langConfig.lang || 'en'
+      return this.$langConfig.lang || 'en-US'
     },
-    $basepath () {
-      return this.$langConfig && this.$langConfig.path || '/'
+    $localePath () {
+      return this.$langConfig.path || '/'
     },
     $page () {
       return findPageForPath(

lib/default-theme/Home.vue

@@ -2,9 +2,9 @@
   <div class="home">
     <div class="hero">
       <img v-if="data.heroImage" :src="$withBase(data.heroImage)" alt="hero">
-      <h1>{{ data.heroText || $title }}</h1>
+      <h1>{{ data.heroText || $title || 'Hello' }}</h1>
       <p class="description">
-        {{ data.tagline || $description }}
+        {{ data.tagline || $description || 'Welcome to your VuePress site' }}
       </p>
       <p class="action" v-if="data.actionText && data.actionLink">
         <NavLink class="action-button" :item="actionLink"/>

lib/default-theme/NavLinks.vue

@@ -32,27 +32,28 @@ export default {
     userNav () {
       const { nav } = this.$site.themeConfig
       if (Array.isArray(nav)) return nav
-      if (typeof nav === 'object') return nav[this.$basepath]
+      if (typeof nav === 'object') return nav[this.$localePath]
       return []
     },
     nav () {
-      if (this.$site.langs && this.$site.langs.length) {
+      if (this.$site.langs) {
         let currentLink = this.$page.path
         const routes = this.$router.options.routes
         const languageDropdown = {
           text: this.$langConfig.selectText,
-          items: this.$site.langs.map(lang => {
-            const text = lang.label
+          items: Object.keys(this.$site.langs).map(path => {
+            const locale = this.$site.langs[path]
+            const text = locale.label
             let link
             // Stay on the current page
-            if (lang.lang === this.$lang) {
+            if (locale.lang === this.$lang) {
               link = currentLink
             } else {
               // Try to stay on the same page
-              link = currentLink.replace(this.$langConfig.path, lang.path)
+              link = currentLink.replace(this.$langConfig.path, path)
               // fallback to homepage
               if (!routes.some(route => route.path === link)) {
-                link = lang.path
+                link = path
               }
             }
             return { text, link }

lib/default-theme/Navbar.vue

@@ -1,12 +1,12 @@
 <template>
   <header class="navbar">
     <SidebarButton @toggle-sidebar="$emit('toggle-sidebar')"/>
-    <router-link :to="$basepath" class="home-link">
+    <router-link :to="$localePath" class="home-link">
       <img class="logo"
         v-if="$site.themeConfig.logo"
         :src="$withBase($site.themeConfig.logo)">
       <span class="site-name"
-        v-if="$site.title"
+        v-if="$title"
         :class="{ 'can-hide': $site.themeConfig.logo }">
         {{ $title }}
       </span>

lib/default-theme/SearchBox.vue

@@ -53,7 +53,7 @@ export default {
 
       const max = 5
       const { pages } = this.$site
-      const localePath = this.$basepath
+      const localePath = this.$localePath
       const matches = item => (
         item.title &&
         item.title.toLowerCase().indexOf(query) > -1