nav ordering

Author: yyx990803

docs/.vuepress/config.js

@@ -9,10 +9,14 @@ module.exports = {
     ['link', { rel: 'icon', href: `${base}logo.png` }]
   ],
   themeConfig: {
-    nav: [
+    sidebar: [
       '/',
-      '/foo',
-      '/bar'
+      '/markdown',
+      '/assets',
+      '/using-vue',
+      '/config',
+      '/theming',
+      '/deploy'
     ]
   }
 }

docs/README.md

@@ -1,5 +1,5 @@
 ---
-navTitle: Intro
+navTitle: Getting Started
 ---
 
 # VuePress

lib/default-theme/Layout.vue

@@ -1,10 +1,7 @@
 <template>
   <div class="theme-container">
-    <div>
-      {{ $site.themeConfig }}
-    </div>
-    <ul class="nav">
-      <li v-for="page in $site.pages">
+    <ul class="sidebar">
+      <li v-for="page in sortedPages">
         <router-link :to="page.path">
           {{ page.frontmatter.navTitle || page.title || page.path }}
         </router-link>
@@ -20,8 +17,37 @@ import nprogress from 'nprogress'
 import Index from './Index.vue'
 import Page from './Page.vue'
 
+function normalize (path) {
+  return path.replace(/\.(md|html)$/, '')
+}
+
+function findIndex (order, page) {
+  const pagePath = normalize(page.path)
+  for (let i = 0; i < order.length; i++) {
+    if (normalize(order[i]) === pagePath) {
+      return i
+    }
+  }
+  return Infinity
+}
+
 export default {
   components: { Index, Page },
+  computed: {
+    sortedPages () {
+      const pages = this.$site.pages
+      const order = this.$site.themeConfig.sidebar
+      if (!order) {
+        return pages
+      } else {
+        return pages.slice().sort((a, b) => {
+          const aIndex = findIndex(order, a)
+          const bIndex = findIndex(order, b)
+          return aIndex - bIndex
+        })
+      }
+    }
+  },
   mounted () {
     nprogress.configure({ showSpinner: false })
 

lib/default-theme/theme.stylus

@@ -11,7 +11,7 @@
   margin-left 300px
   margin-bottom 30px
 
-.nav
+.sidebar
   position fixed
   margin 0
   top 30px

lib/prepare.js

@@ -127,11 +127,11 @@ async function resolveOptions (sourceDir) {
 
   // resolve site data
   options.siteData = {
-    title: siteConfig.title,
-    description: siteConfig.description,
+    title: siteConfig.title || '',
+    description: siteConfig.description || '',
     base: siteConfig.base || '/',
     pages: pagesData,
-    themeConfig: siteConfig.themeConfig
+    themeConfig: siteConfig.themeConfig || {}
   }
 
   return options