feat(cli): support more features

packages/vant-cli/site/mobile/App.vue

@@ -11,9 +11,7 @@
 import DemoNav from './components/DemoNav';
 
 export default {
-  components: {
-    DemoNav
-  }
+  components: { DemoNav }
 };
 </script>
 

packages/vant-cli/site/mobile/components/DemoBlock.vue

@@ -1,8 +1,8 @@
 <template>
-  <section class="van-doc-demo-block">
+  <div class="van-doc-demo-block">
     <h2 class="van-doc-demo-block__title">{{ title }}</h2>
     <slot />
-  </section>
+  </div>
 </template>
 
 <script>

packages/vant-cli/site/mobile/components/DemoNav.vue

@@ -1,7 +1,7 @@
 <template>
-  <div v-show="title" class="van-doc-demo-nav">
-    <div class="van-doc-demo-nav__title">{{ title }}</div>
-    <svg class="van-doc-demo-nav__back" viewBox="0 0 1000 1000" @click="onBack">
+  <div v-show="title" class="demo-nav">
+    <div class="demo-nav__title">{{ title }}</div>
+    <svg class="demo-nav__back" viewBox="0 0 1000 1000" @click="onBack">
       <path fill="#969799" fill-rule="evenodd" :d="path" />
     </svg>
   </div>
@@ -19,7 +19,8 @@ export default {
 
   computed: {
     title() {
-      const { name } = this.$route.meta || {};
+      const route = this.$route || {};
+      const { name } = route.meta || {};
       return name ? name.replace(/-/g, '') : '';
     }
   },
@@ -33,7 +34,7 @@ export default {
 </script>
 
 <style lang="less">
-.van-doc-demo-nav {
+.demo-nav {
   position: relative;
   height: 56px;
   line-height: 56px;

packages/vant-cli/site/mobile/components/DemoSection.vue

@@ -12,7 +12,7 @@ export default {
 
   computed: {
     demoName() {
-      const { meta } = this.$route;
+      const { meta } = this.$route || {};
       if (meta && meta.name) {
         return `demo-${decamelize(meta.name, '-')}`;
       }

packages/vant-cli/site/mobile/main.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 import VueRouter from 'vue-router';
 import DemoBlock from './components/DemoBlock';
 import DemoSection from './components/DemoSection';
-import routes from './router';
+import { routes } from './router';
 import App from './App';
 import '@vant/touch-emulator';
 import '../common/iframe-router';
@@ -18,7 +18,9 @@ const router = new VueRouter({
 });
 
 router.afterEach(() => {
-  Vue.nextTick(window.syncPath);
+  if (!router.currentRoute.redirectedFrom) {
+    Vue.nextTick(window.syncPath);
+  }
 });
 
 window.vueRouter = router;

packages/vant-cli/site/mobile/router.js

@@ -1,24 +1,29 @@
+import decamelize from 'decamelize';
+import DemoHome from './components/DemoHome';
 import { demos } from '../../dist/mobile-config';
 
 const routes = [];
 const names = Object.keys(demos);
 
-Object.keys(demos).forEach((name, index) => {
-  if (index === 0) {
-    routes.push({
-      path: '*',
-      redirect: () => `/${names[0]}`
-    });
-  }
+routes.push({
+  path: '/home',
+  component: DemoHome
+});
 
+routes.push({
+  path: '*',
+  redirect: '/home'
+});
+
+names.forEach(name => {
   routes.push({
     name,
     component: demos[name],
-    path: `/${name}`,
+    path: `/${decamelize(name, '-')}`,
     meta: {
       name
     }
   });
 });
 
-export default routes;
+export { routes };