refactor: use async components to simplify code

Author: ulivz

lib/prepare/codegen.js

@@ -21,37 +21,16 @@ exports.pathsToModuleCode = function (files) {
   return code
 }
 
-exports.getPageComponentsLoadingFile = function (pages) {
-  let code = 'const _l = {}\n'
-
-  code += pages.map(({ filepath, key }) => {
-    return `_l['${key}'] = () => import('${filepath}')`
-  }).join('\n')
-
-  code += `\n\nexport default function loadComponent(key) {
-   return _l[key]()
-}\n`
-  return code
-}
-
 exports.genRoutesFile = async function ({
   siteData: { pages },
   plugin
 }) {
-  await writeTemp('components-loader.js', exports.getPageComponentsLoadingFile(pages))
-
   function genRoute ({ path: pagePath, key: componentName }, index) {
     let code = `
   {
     name: ${JSON.stringify(componentName)},
     path: ${JSON.stringify(pagePath)},
-    component: ThemeLayout,
-    beforeEnter: (to, from, next) => {
-      loadComponent(${JSON.stringify(componentName)}).then(comp => {
-        Vue.component(${JSON.stringify(componentName)}, comp.default)
-        next()
-      })
-    }
+    component: ThemeLayout
   }`
 
     const dncodedPath = decodeURIComponent(pagePath)
@@ -94,11 +73,11 @@ exports.genRoutesFile = async function ({
     `import Vue from 'vue'\n` +
     `import ThemeLayout from '@themeLayout'\n` +
     `import ThemeNotFound from '@themeNotFound'\n` +
-    `import { injectMixins } from '@app/util'\n` +
-    `import loadComponent from '@temp/components-loader'\n` +
+    `import { injectMixins, loadComponent } from '@app/util'\n` +
     `import rootMixins from '@temp/root-mixins'\n\n` +
     `injectMixins(ThemeLayout, rootMixins)\n` +
     `injectMixins(ThemeNotFound, rootMixins)\n\n` +
+    `${pages.map(({ filepath, key }) => `Vue.component('${key}', () => import('${filepath}'))`).join('\n')}\n\n` +
     `export const routes = [${pages.map(genRoute).join(',')}${notFoundRoute}\n]`
   )
 }

packages/vuepress-translation-comparison/TranslationHelper.vue

@@ -20,9 +20,6 @@ export default {
       currentPath: '/'
     }
   },
-  created () {
-    console.log(this.key)
-  },
   computed: {
     key () {
       return this.currentPage.key