refactor: some enhancement:

1. Strip date from slug,
2. Rename I18n to ClientComputedMixin,
3. Clean internal I18nTemp plugin

Author: ulivz

packages/@vuepress/core/lib/app/Store.js

@@ -0,0 +1,19 @@
+import Vue from 'vue'
+
+export default class Store {
+  constructor () {
+    this.store = new Vue({
+      data: {
+        ob: {}
+      }
+    })
+  }
+
+  get (key) {
+    return this.store.ob[key]
+  }
+
+  set (key, value) {
+    Vue.set(this.store.ob, key, value)
+  }
+}

packages/@vuepress/core/lib/app/app.js

@@ -6,7 +6,8 @@ import { routes } from '@internal/routes'
 import { siteData } from '@internal/siteData'
 import appEnhancers from '@internal/app-enhancers'
 import globalUIComponents from '@internal/global-ui'
-import I18n from '@internal/i18n'
+import ClientComputedMixin from '../prepare/ClientComputedMixin'
+import Store from './Store'
 
 // generated from user config
 import('@temp/style.styl')
@@ -30,9 +31,12 @@ if (module.hot) {
 }
 
 Vue.config.productionTip = false
+
+Vue.$store = new Store()
+
 Vue.use(Router)
 // mixin for exposing $site and $page
-Vue.mixin(dataMixin(I18n, siteData))
+Vue.mixin(dataMixin(ClientComputedMixin, siteData))
 // component for rendering markdown content and setting title etc.
 Vue.component('Content', Content)
 Vue.component('OutboundLink', OutboundLink)
@@ -59,7 +63,7 @@ export function createApp (isServer) {
       if (saved) {
         return saved
       } else if (to.hash) {
-        if (Vue.$store.disableScrollBehavior) {
+        if (Vue.$store.get('disableScrollBehavior')) {
           return false
         }
         return {

packages/@vuepress/core/lib/app/dataMixin.js

@@ -4,22 +4,16 @@ import Vue from 'vue'
 
 export default function dataMixin (I18n, siteData) {
   prepare(siteData)
-  const store = new Vue({
-    data: {
-      siteData,
-      disableScrollBehavior: false
-    }
-  })
-  Vue.$store = store
+  Vue.$store.set('siteData', siteData)
 
   if (module.hot) {
     module.hot.accept(VUEPRESS_TEMP_PATH + '/internal/siteData.js', () => {
       prepare(siteData)
-      store.siteData = siteData
+      Vue.$store.set('siteData', siteData)
     })
   }
 
-  const I18nConstructor = I18n(store)
+  const I18nConstructor = I18n(Vue.$store.get('siteData'))
   const i18n = new I18nConstructor()
   const descriptors = Object.getOwnPropertyDescriptors(Object.getPrototypeOf(i18n))
   const computed = {}

packages/@vuepress/core/lib/internal-plugins/i18nTemp.js

@@ -11,7 +11,7 @@ const loadTheme = require('./loadTheme')
 const { fs, logger, chalk, globby, sort, datatypes: { isFunction }} = require('@vuepress/shared-utils')
 
 const Page = require('./Page')
-const I18n = require('./I18n')
+const ClientComputedMixin = require('./ClientComputedMixin')
 const PluginAPI = require('../plugin-api/index')
 
 /**
@@ -54,7 +54,7 @@ module.exports = class AppContext {
 
     this.pluginAPI = new PluginAPI(this)
     this.pages = [] // Array<Page>
-    this.I18nConstructor = I18n(null)
+    this.ClientComputedMixinConstructor = ClientComputedMixin(this.getSiteData())
   }
 
   /**
@@ -73,8 +73,8 @@ module.exports = class AppContext {
 
     await this.resolvePages()
     await Promise.all(
-      this.pluginAPI.options.additionalPages.values.map(async ({ path, permalink }) => {
-        await this.addPage({ filePath: path, permalink })
+      this.pluginAPI.options.additionalPages.values.map(async (options) => {
+        await this.addPage(options)
       })
     )
 
@@ -109,7 +109,6 @@ module.exports = class AppContext {
       .use(require('../internal-plugins/rootMixins'))
       .use(require('../internal-plugins/enhanceApp'))
       .use(require('../internal-plugins/overrideCSS'))
-      .use(require('../internal-plugins/i18nTemp'))
       .use(require('../internal-plugins/layoutComponents'))
       .use(require('../internal-plugins/pageComponents'))
       // user plugin
@@ -213,10 +212,10 @@ module.exports = class AppContext {
 
   async addPage (options) {
     options.permalinkPattern = this.siteConfig.permalink
-    const page = new Page(options)
+    const page = new Page(options, this)
     await page.process({
       markdown: this.markdown,
-      i18n: new this.I18nConstructor((this.getSiteData.bind(this))),
+      computed: new this.ClientComputedMixinConstructor(),
       enhancers: this.pluginAPI.options.extendPageData.items
     })
     this.pages.push(page)
@@ -249,13 +248,20 @@ module.exports = class AppContext {
    */
 
   getSiteData () {
+    const { locales } = this.siteConfig
+    if (locales) {
+      Object.keys(locales).forEach(path => {
+        locales[path].path = path
+      })
+    }
+
     return {
       title: this.siteConfig.title || '',
       description: this.siteConfig.description || '',
       base: this.base,
       pages: this.pages.map(page => page.toJson()),
       themeConfig: this.siteConfig.themeConfig || {},
-      locales: this.siteConfig.locales
+      locales
     }
   }
 }

packages/@vuepress/core/lib/prepare/AppContext.js

@@ -0,0 +1,128 @@
+'use strict'
+
+/**
+ * Get page data via path (permalink).
+ *
+ * @param {array} pages
+ * @param {string} path
+ * @returns {object}
+ */
+
+function findPageForPath (pages, path) {
+  for (let i = 0; i < pages.length; i++) {
+    const page = pages[i]
+    if (page.path === path) {
+      return page
+    }
+  }
+  return {
+    path: '',
+    frontmatter: {}
+  }
+}
+
+/**
+ * Expose a function to get ClientComputedMixin constructor.
+ * Note that this file will run in both server and client side.
+ *
+ * @param {object} siteData
+ * @returns {ClientComputedMixin}
+ */
+
+module.exports = siteData => {
+  // We cannot use class here. webpack will throw error.
+  function ClientComputedMixin () {}
+
+  ClientComputedMixin.prototype = {
+    setPage (page) {
+      this.__page = page
+    },
+
+    get $site () {
+      return siteData
+    },
+
+    get $themeConfig () {
+      return this.$site.themeConfig
+    },
+
+    get $localeConfig () {
+      const { locales = {}} = this.$site
+      let targetLang
+      let defaultLang
+      for (const path in locales) {
+        if (path === '/') {
+          defaultLang = locales[path]
+        } else if (this.$page.path.indexOf(path) === 0) {
+          targetLang = locales[path]
+        }
+      }
+      return targetLang || defaultLang || {}
+    },
+
+    get $siteTitle () {
+      return this.$localeConfig.title || this.$site.title || ''
+    },
+
+    get $title () {
+      const page = this.$page
+      const siteTitle = this.$siteTitle
+      const selfTitle = page.frontmatter.home ? null : (
+        page.frontmatter.title || // explicit title
+        page.title // inferred title
+      )
+      return siteTitle
+        ? selfTitle
+          ? (selfTitle + ' | ' + siteTitle)
+          : siteTitle
+        : selfTitle || 'VuePress'
+    },
+
+    get $description () {
+      // #565 hoist description from meta
+      const description = getMetaDescription(this.$page.frontmatter.meta)
+      if (description) {
+        return description
+      }
+      // if (this.$page.frontmatter.meta) {
+      //   const descriptionMeta = this.$page.frontmatter.meta.filter(item => item.name === 'description')[0]
+      //   if (descriptionMeta) return descriptionMeta.content
+      // }
+      return this.$page.frontmatter.description || this.$localeConfig.description || this.$site.description || ''
+    },
+
+    get $lang () {
+      return this.$page.frontmatter.lang || this.$localeConfig.lang || 'en-US'
+    },
+
+    get $localePath () {
+      return this.$localeConfig.path || '/'
+    },
+
+    get $themeLocaleConfig () {
+      return (this.$site.themeConfig.locales || {})[this.$localePath] || {}
+    },
+
+    get $page () {
+      if (this.__page) {
+        return this.__page
+      }
+      return findPageForPath(
+        this.$site.pages,
+        this.$route.path
+      )
+    }
+  }
+
+  return ClientComputedMixin
+}
+
+function getMetaDescription (meta) {
+  if (meta) {
+    // Why '(() => 'name')()' ?
+    // You can use item.name directly and see what happened.
+    // "How many pits did webpack bury?"
+    const descriptionMeta = meta.filter(item => item[(() => 'name')()] === 'description')[0]
+    if (descriptionMeta) return descriptionMeta.content
+  }
+}