[Doc] use vant-doc to build website

.babelrc

@@ -0,0 +1,13 @@
+{
+  "presets": [
+    "stage-0",
+    [
+      "env",
+      {
+        "loose": true,
+        "exclude": ["transform-es2015-typeof-symbol"]
+      }
+    ]
+  ],
+  "plugins": ["transform-runtime"]
+}

.gitignore

@@ -10,3 +10,4 @@ assets/icons/build
 assets/icons/svg
 example/dist
 website/dist
+docs/dist

build/build-entry.js

@@ -0,0 +1,31 @@
+const fs = require('fs-extra');
+const glob = require('fast-glob');
+const path = require('path');
+const tips = '// This file is auto gererated by build/build-entry.js';
+const root = path.join(__dirname, '../');
+const join = dir => path.join(root, dir);
+
+// generate webpack entry file for markdown docs
+function buildDocsEntry() {
+  const output = join('docs/src/docs-entry.js');
+  const getName = fullPath => fullPath.replace(/(\/README)|(\.md)/g, '').split('/').pop();
+  const docs = glob
+    .sync([
+      join('docs/**/*.md'),
+      join('packages/**/*.md'),
+      '!**/node_modules/**'
+    ])
+    .map(fullPath => {
+      const name = getName(fullPath);
+      return `'${name}': () => import('${path.relative(join('docs/src'), fullPath)}')`;
+    });
+
+  const content = `${tips}
+export default {
+  ${docs.join(',\n  ')}
+};
+`;
+  fs.writeFileSync(output, content);
+}
+
+buildDocsEntry();

build/release.sh

@@ -0,0 +1,39 @@
+git checkout master
+git merge dev
+
+#!/usr/bin/env sh
+set -e
+echo "Enter release version: "
+read VERSION
+
+read -p "Releasing $VERSION - are you sure? (y/n)" -n 1 -r
+echo    # (optional) move to a new line
+if [[ $REPLY =~ ^[Yy]$ ]]
+then
+  echo "Releasing $VERSION ..."
+
+  # build
+  npm run components
+
+  # commit build
+  git add -A
+  git commit -m "[build] $VERSION"
+
+  # commit
+  npm version $VERSION --message "[release] $VERSION"
+
+  # publish
+  echo "publishing git..."
+  git push origin master
+  git push origin refs/tags/v$VERSION
+
+  echo "publishing npm..."
+  npm publish
+
+  # sync dev
+  echo "sync dev..."
+  git checkout dev
+  git rebase master
+  git push origin dev
+
+fi

build/webpack.dev.js

@@ -0,0 +1,87 @@
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const ProgressBarPlugin = require('progress-bar-webpack-plugin');
+const { VueLoaderPlugin } = require('vue-loader');
+
+module.exports = {
+  mode: 'development',
+  entry: {
+    'vant-docs': './docs/src/index.js'
+  },
+  output: {
+    path: path.join(__dirname, '../docs/dist'),
+    publicPath: '/',
+    chunkFilename: 'async_[name].js'
+  },
+  stats: {
+    modules: false,
+    children: false
+  },
+  serve: {
+    open: true,
+    host: '0.0.0.0',
+    devMiddleware: {
+      logLevel: 'warn'
+    },
+    hotClient: {
+      logLevel: 'warn'
+    }
+  },
+  resolve: {
+    extensions: ['.js', '.vue', '.css'],
+    alias: {
+      packages: path.join(__dirname, '../packages')
+    }
+  },
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        use: [
+          {
+            loader: 'vue-loader',
+            options: {
+              compilerOptions: {
+                preserveWhitespace: false
+              }
+            }
+          }
+        ]
+      },
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        use: 'babel-loader'
+      },
+      {
+        test: /\.(css|postcss)$/,
+        use: [
+          'style-loader',
+          'css-loader',
+          'postcss-loader'
+        ]
+      },
+      {
+        test: /\.md$/,
+        use: [
+          'vue-loader',
+          'fast-vue-md-loader'
+        ]
+      },
+      {
+        test: /\.(ttf|svg)$/,
+        loader: 'url-loader'
+      }
+    ]
+  },
+  plugins: [
+    new VueLoaderPlugin(),
+    new ProgressBarPlugin(),
+    new HtmlWebpackPlugin({
+      chunks: ['vant-docs'],
+      template: 'docs/src/index.tpl',
+      filename: 'index.html',
+      inject: true
+    })
+  ]
+};

build/webpack.doc.js

@@ -0,0 +1,14 @@
+const path = require('path');
+const config = require('./webpack.dev.js');
+
+delete config.serve;
+
+module.exports = Object.assign(config, {
+  mode: 'production',
+  output: {
+    path: path.join(__dirname, '../docs/dist'),
+    publicPath: 'https://youzan.github.io/vant/',
+    filename: '[name].[hash:8].js',
+    chunkFilename: 'async_[name].[chunkhash:8].js'
+  }
+});

docs/src/App.vue

@@ -0,0 +1,47 @@
+<template>
+  <van-doc :config="config">
+    <router-view />
+  </van-doc>
+</template>
+
+<script>
+import docConfig from './doc.config';
+
+export default {
+  computed: {
+    config() {
+      return docConfig;
+    }
+  }
+};
+</script>
+
+<style lang="postcss">
+.van-doc-intro {
+  text-align: center;
+  font-family: "Dosis", "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
+
+  &__youzan {
+    width: 32px;
+    height: 32px;
+    display: block;
+    margin: 25px 0 0;
+  }
+
+  &__logo {
+    width: 120px;
+    height: 120px;
+  }
+
+  h2 {
+    font-size: 32px;
+    line-height: 60px;
+    font-weight: normal;
+  }
+
+  p {
+    font-size: 15px;
+    color: #455a64;
+  }
+}
+</style>

docs/src/doc.config.js

@@ -0,0 +1,165 @@
+/* eslint-disable */
+const version = require('../../package.json').version;
+
+module.exports = {
+  header: {
+    logo: {
+      image: 'https://img.yzcdn.cn/public_files/2017/12/18/fd78cf6bb5d12e2a119d0576bedfd230.png',
+      title: 'Vant Weapp',
+      version,
+      href: '#/'
+    },
+    nav: {
+      github: 'https://github.com/youzan/vant'
+    }
+  },
+  nav: [
+    {
+      name: '开发指南',
+      groups: [
+        {
+          list: [
+            {
+              path: '/intro',
+              title: '介绍'
+            },
+            {
+              path: '/quickstart',
+              title: '快速上手'
+            },
+            {
+              path: '/changelog',
+              title: '更新日志'
+            }
+          ]
+        }
+      ]
+    },
+    {
+      name: '组件',
+      groups: [
+        {
+          groupName: '基础组件',
+          list: [
+            {
+              path: '/col',
+              title: 'Layout 布局'
+            },
+            {
+              path: '/badge',
+              title: 'Badge 徽章'
+            },
+            {
+              path: '/button',
+              title: 'Button 按钮'
+            },
+            {
+              path: '/cell',
+              title: 'Cell 单元格'
+            },
+            {
+              path: '/icon',
+              title: 'Icon 图标'
+            },
+            {
+              path: '/loading',
+              title: 'Loading 加载'
+            },
+            {
+              path: '/notice-bar',
+              title: 'NoticeBar 通告栏'
+            },
+            {
+              path: '/panel',
+              title: 'Panel 面板'
+            },
+            {
+              path: '/popup',
+              title: 'Popup 弹出层'
+            },
+            {
+              path: '/steps',
+              title: 'Steps 步骤条'
+            },
+            {
+              path: '/tab',
+              title: 'Tab 标签页'
+            },
+            {
+              path: '/tag',
+              title: 'Tag 标记'
+            }
+          ]
+        },
+        {
+          groupName: '表单组件',
+          list: [
+            {
+              path: '/checkbox',
+              title: 'Checkbox 复选框'
+            },
+            {
+              path: '/field',
+              title: 'Field 输入框'
+            },
+            {
+              path: '/radio',
+              title: 'Radio 单选框'
+            },
+            {
+              path: '/search',
+              title: 'Search 搜索'
+            },
+            {
+              path: '/stepper',
+              title: 'Stepper 步进器'
+            },
+            {
+              path: '/switch',
+              title: 'Switch 开关'
+            }
+          ]
+        },
+        {
+          groupName: '操作反馈',
+          list: [
+            {
+              path: '/actionsheet',
+              title: 'Actionsheet 上拉菜单'
+            },
+            {
+              path: '/datetime-picker',
+              title: 'DatetimePicker 时间选择'
+            },
+            {
+              path: '/dialog',
+              title: 'Dialog 弹出框'
+            },
+            {
+              path: '/toast',
+              title: 'Toast 轻提示'
+            }
+          ]
+        },
+        {
+          groupName: '高阶组件',
+          list: [
+            {
+              path: '/tree-select',
+              title: 'TreeSelect 分类选择'
+            }
+          ]
+        },
+        {
+          groupName: '业务组件',
+          list: [
+            {
+              path: '/card',
+              title: 'Card 卡片'
+            }
+          ]
+        }
+      ]
+    }
+  ]
+};

docs/src/docs-entry.js

@@ -0,0 +1,32 @@
+// This file is auto gererated by build/build-entry.js
+export default {
+  'changelog': () => import('../markdown/changelog.md'),
+  'intro': () => import('../markdown/intro.md'),
+  'quickstart': () => import('../markdown/quickstart.md'),
+  'actionsheet': () => import('../../packages/actionsheet/README.md'),
+  'badge': () => import('../../packages/badge/README.md'),
+  'button': () => import('../../packages/button/README.md'),
+  'card': () => import('../../packages/card/README.md'),
+  'cell': () => import('../../packages/cell/README.md'),
+  'checkbox': () => import('../../packages/checkbox/README.md'),
+  'col': () => import('../../packages/col/README.md'),
+  'common': () => import('../../packages/common/README.md'),
+  'datetime-picker': () => import('../../packages/datetime-picker/README.md'),
+  'dialog': () => import('../../packages/dialog/README.md'),
+  'field': () => import('../../packages/field/README.md'),
+  'icon': () => import('../../packages/icon/README.md'),
+  'loading': () => import('../../packages/loading/README.md'),
+  'notice-bar': () => import('../../packages/notice-bar/README.md'),
+  'panel': () => import('../../packages/panel/README.md'),
+  'popup': () => import('../../packages/popup/README.md'),
+  'radio': () => import('../../packages/radio/README.md'),
+  'search': () => import('../../packages/search/README.md'),
+  'stepper': () => import('../../packages/stepper/README.md'),
+  'steps': () => import('../../packages/steps/README.md'),
+  'switch': () => import('../../packages/switch/README.md'),
+  'tab': () => import('../../packages/tab/README.md'),
+  'tag': () => import('../../packages/tag/README.md'),
+  'toast': () => import('../../packages/toast/README.md'),
+  'toptips': () => import('../../packages/toptips/README.md'),
+  'tree-select': () => import('../../packages/tree-select/README.md')
+};

docs/src/index.js

@@ -0,0 +1,35 @@
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+import App from './App';
+import routes from './router';
+import VantDoc, { progress } from 'vant-doc';
+
+Vue.use(VueRouter).use(VantDoc);
+
+const router = new VueRouter({
+  mode: 'hash',
+  routes: routes()
+});
+
+router.beforeEach((route, redirect, next) => {
+  progress.start();
+  document.title = route.meta.title || document.title;
+  next();
+});
+
+router.afterEach(() => {
+  progress.done();
+  window.scrollTo(0, 0);
+});
+
+window.vueRouter = router;
+
+if (process.env.NODE_ENV !== 'production') {
+  Vue.config.productionTip = false;
+}
+
+new Vue({ // eslint-disable-line
+  render: h => h(App),
+  router,
+  el: '#app'
+});

docs/src/index.tpl

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+  <meta http-Equiv="Cache-Control" Content="no-cache" />
+  <meta http-Equiv="Pragma" Content="no-cache" />
+  <meta http-Equiv="Expires" Content="0" />
+  <link rel="shortcut icon" href="https://img.yzcdn.cn/zanui/vant/vant-2017-12-18.ico">
+  <title>Vant Weapp - 轻量、可靠的小程序 UI 组件库</title>
+  <script>window.Promise || document.write('<script src="//img.yzcdn.cn/huiyi/build/h5/js/pinkie.min.js"><\/script>');</script>
+</head>
+<body ontouchstart>
+
+<div id="app"></div>
+
+</body>
+</html>

docs/src/router.js

@@ -0,0 +1,48 @@
+import docConfig from './doc.config';
+import componentDocs from './docs-entry';
+
+const registerRoute = () => {
+  const route = [{
+    path: '*',
+    redirect: to => `/quickstart`
+  }];
+
+  const navs = docConfig.nav || [];
+
+  navs.forEach(nav => {
+    if (nav.groups) {
+      nav.groups.forEach(group => {
+        group.list.forEach(page => addRoute(page));
+      });
+    } else {
+      addRoute(nav);
+    }
+  });
+
+  function addRoute(page) {
+    let { path } = page;
+    if (path) {
+      path = path.replace('/', '');
+
+      const component = componentDocs[`${path}`];
+
+      if (!component) {
+        return;
+      }
+
+      route.push({
+        name: '/' + path,
+        component,
+        path: `/${path}`,
+        meta: {
+          path,
+          name: page.title
+        }
+      });
+    }
+  }
+
+  return route;
+};
+
+export default registerRoute;

package.json

@@ -10,7 +10,7 @@
     "release": "sh scripts/release.sh",
     "components": "cross-env NODE_ENV=production node scripts/build-components.js --color",
     "changelog": "sh scripts/build-changelog.sh",
-    "dev": "node scripts/build-dev.js --color",
+    "dev": "node build/build-entry.js && webpack-serve --config build/webpack.dev.js",
     "build": "sh scripts/deploy.sh",
     "watch:doc": "NODE_ENV=development wedoc run watch",
     "build:doc": "NODE_ENV=production wedoc run build",
@@ -34,16 +34,20 @@
     "safari 6"
   ],
   "devDependencies": {
-    "autoprefixer": "^8.5.0",
+    "autoprefixer": "^9.0.2",
+    "babel-cli": "^6.26.0",
     "babel-core": "^6.26.3",
-    "babel-eslint": "^8.2.3",
-    "babel-plugin-transform-es2015-spread": "^6.22.0",
-    "babel-plugin-transform-runtime": "^6.23.0",
+    "babel-jest": "^23.4.2",
+    "babel-loader": "^7.1.5",
+    "babel-plugin-transform-runtime": "^6.15.0",
     "babel-preset-env": "^1.7.0",
     "babel-preset-stage-0": "^6.24.1",
     "cross-env": "^5.1.4",
+    "css-loader": "^1.0.0",
     "eslint": "^5.1.0",
     "eslint-plugin-vue-libs": "^3.0.0",
+    "fast-glob": "^2.2.2",
+    "fast-vue-md-loader": "^1.0.3",
     "fs-extra": "^4.0.2",
     "gh-pages": "^1.1.0",
     "gulp": "^3.9.1",
@@ -53,11 +57,24 @@
     "gulp-remove-logging": "^1.2.0",
     "gulp-rename": "^1.2.2",
     "gulp-util": "^3.0.8",
+    "html-webpack-plugin": "^3.2.0",
     "node-watch": "^0.5.5",
     "postcss-calc": "^6.0.1",
     "postcss-easy-import": "^3.0.0",
+    "postcss-loader": "^2.1.6",
     "precss": "^2.0.0",
+    "progress-bar-webpack-plugin": "^1.11.0",
     "shelljs": "^0.7.8",
-    "wedoc": "0.0.16"
+    "style-loader": "^0.22.1",
+    "url-loader": "^1.0.1",
+    "vant-doc": "^1.0.11",
+    "vue": "2.5.17",
+    "vue-loader": "^15.2.6",
+    "vue-router": "^3.0.1",
+    "vue-template-compiler": "2.5.17",
+    "vue-template-es2015-compiler": "^1.6.0",
+    "webpack": "^4.16.5",
+    "webpack-cli": "^3.1.0",
+    "webpack-serve": "^2.0.2"
   }
 }