build: add files of vant-cli 2

2025-04-06 03:57:59 +08:00 · 2019-11-18 16:27:12 +08:00 · 2019-11-18 16:27:12 +08:00 · 08e9d99699
commit 08e9d99699
parent f6650aa1cd
46 changed files with 12125 additions and 249 deletions
--- a/packages/vant-cli/README.md
+++ b/packages/vant-cli/README.md
@ -19,7 +19,7 @@ yarn add @vant/cli --dev
 #### Build Changelog

 ```shell
-vant changelog ./name.md
+vant-cli changelog ./name.md
 ```

 #### Commit Lint
@ -27,7 +27,7 @@ vant changelog ./name.md
 ```json
 "husky": {
  "hooks": {
-    "commit-msg": "vant commit-lint"
+    "commit-msg": "vant-cli commit-lint"
  }
 }
 ```
--- a/packages/vant-cli/package.json
+++ b/packages/vant-cli/package.json
@ -1,20 +1,113 @@
 {
  "name": "@vant/cli",
-  "version": "1.0.6",
-  "description": "vant cli tools",
-  "main": "./src/index.js",
+  "version": "2.0.0-beta.0",
+  "description": "",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
  "bin": {
-    "vant": "./src/index.js"
+    "vant-cli": "./lib/index.js"
  },
  "publishConfig": {
    "access": "public"
  },
+  "scripts": {
+    "dev": "tsc --watch",
+    "release": "tsc & release-it"
+  },
+  "files": [
+    "lib",
+    "site",
+    "preset.js"
+  ],
+  "author": "chenjiahan",
  "license": "MIT",
-  "repository": "https://github.com/youzan/vant/tree/dev/packages/vant-cli",
+  "peerDependencies": {
+    "vue": "^2.6.10",
+    "vue-template-compiler": "^2.6.10"
+  },
+  "devDependencies": {
+    "@types/eslint": "^6.1.3",
+    "@types/fs-extra": "^8.0.1",
+    "@types/html-webpack-plugin": "^3.2.1",
+    "@types/less": "^3.0.1",
+    "@types/postcss-load-config": "^2.0.0",
+    "@types/sass": "^1.16.0",
+    "@types/shelljs": "^0.8.6",
+    "@types/signale": "^1.2.1",
+    "@types/source-map": "^0.5.7",
+    "@types/stylelint": "^9.10.1",
+    "@types/webpack": "^4.39.8",
+    "@types/webpack-dev-server": "^3.4.0",
+    "@types/webpack-merge": "^4.1.5",
+    "vue": "^2.6.10",
+    "vue-template-compiler": "^2.6.10"
+  },
  "dependencies": {
-    "commander": "^2.17.1",
-    "husky": "^3.0.4",
-    "shelljs": "^0.8.2",
-    "signale": "^1.4.0"
+    "@babel/core": "^7.7.2",
+    "@babel/plugin-proposal-optional-chaining": "^7.6.0",
+    "@babel/plugin-syntax-jsx": "^7.2.0",
+    "@babel/plugin-transform-object-assign": "^7.2.0",
+    "@babel/plugin-transform-runtime": "^7.6.2",
+    "@babel/preset-env": "^7.7.1",
+    "@babel/preset-typescript": "^7.7.2",
+    "@types/jest": "^24.0.22",
+    "@vant/doc": "^2.6.1",
+    "@vant/eslint-config": "^1.4.0",
+    "@vant/markdown-loader": "^2.2.0",
+    "@vant/markdown-vetur": "^1.0.0",
+    "@vant/stylelint-config": "^1.0.0",
+    "@vant/touch-emulator": "^1.1.0",
+    "@vue/babel-preset-jsx": "^1.1.1",
+    "@vue/component-compiler-utils": "^3.0.2",
+    "@vue/test-utils": "^1.0.0-beta.29",
+    "autoprefixer": "^9.7.1",
+    "babel-jest": "^24.9.0",
+    "babel-loader": "^8.0.6",
+    "codecov": "^3.6.1",
+    "commander": "^4.0.0",
+    "cross-env": "^6.0.3",
+    "css-loader": "^3.2.0",
+    "csso": "^4.0.2",
+    "dependency-tree": "^7.0.2",
+    "eslint": "^6.6.0",
+    "gh-pages": "2.0.1",
+    "html-webpack-plugin": "3.2.0",
+    "husky": "^3.1.0",
+    "jest": "^24.9.0",
+    "jest-serializer-vue": "^2.0.2",
+    "less": "^3.10.3",
+    "less-loader": "^5.0.0",
+    "lint-staged": "^9.4.2",
+    "portfinder": "^1.0.25",
+    "postcss": "^7.0.21",
+    "postcss-loader": "^3.0.0",
+    "release-it": "^12.4.3",
+    "sass": "^1.23.3",
+    "sass-loader": "^8.0.0",
+    "shelljs": "^0.8.3",
+    "signale": "^1.4.0",
+    "style-loader": "^1.0.0",
+    "stylelint": "^11.1.1",
+    "typescript": "^3.7.2",
+    "vue-jest": "4.0.0-beta.2",
+    "vue-loader": "^15.7.2",
+    "vue-router": "^3.1.3",
+    "webpack": "^4.41.2",
+    "webpack-dev-server": "3.9.0",
+    "webpack-merge": "^4.2.2"
+  },
+  "eslintConfig": {
+    "root": true,
+    "extends": [
+      "@vant"
+    ]
+  },
+  "stylelint": {
+    "extends": [
+      "@vant/stylelint-config"
+    ]
+  },
+  "prettier": {
+    "singleQuote": true
  }
 }
--- a/packages/vant-cli/preset.js
+++ b/packages/vant-cli/preset.js
@ -0,0 +1,3 @@
+const babelConfig = require('./lib/config/babel.config');
+
+module.exports = () => babelConfig();
--- a/packages/vant-cli/site/common/iframe-router.js
+++ b/packages/vant-cli/site/common/iframe-router.js
@ -0,0 +1,29 @@
+/**
+ * 同步父窗口和 iframe 的 vue-router 状态
+ */
+
+import { iframeReady, isMobile } from '.';
+
+window.syncPath = function () {
+  const router = window.vueRouter;
+  const isInIframe = window !== window.top;
+  const currentDir = router.history.current.path;
+
+  if (isInIframe) {
+    window.top.changePath(currentDir);
+  } else if (!isMobile) {
+    const iframe = document.querySelector('iframe');
+    if (iframe) {
+      iframeReady(iframe, () => {
+        iframe.contentWindow.changePath(currentDir);
+      });
+    }
+  }
+};
+
+window.changePath = function (path = '') {
+  // should preserve hash for anchor
+  if (window.vueRouter.currentRoute.path !== path) {
+    window.vueRouter.replace(path).catch(() => {});
+  }
+};
--- a/packages/vant-cli/site/common/index.js
+++ b/packages/vant-cli/site/common/index.js
@ -0,0 +1,26 @@
+function iframeReady(iframe, callback) {
+  const doc = iframe.contentDocument || iframe.contentWindow.document;
+  const interval = () => {
+    if (iframe.contentWindow.changePath) {
+      callback();
+    } else {
+      setTimeout(() => {
+        interval();
+      }, 50);
+    }
+  };
+
+  if (doc.readyState === 'complete') {
+    interval();
+  } else {
+    iframe.onload = interval;
+  }
+}
+
+const ua = navigator.userAgent.toLowerCase();
+const isMobile = /ios|iphone|ipod|ipad|android/.test(ua);
+
+export {
+  isMobile,
+  iframeReady
+};
--- a/packages/vant-cli/site/desktop/App.vue
+++ b/packages/vant-cli/site/desktop/App.vue
@ -0,0 +1,32 @@
+<template>
+  <div class="app">
+    <van-doc :config="config" :simulator="simulator">
+      <router-view />
+    </van-doc>
+  </div>
+</template>
+
+<script>
+import { config } from '../../dist/desktop-config';
+
+export default {
+  data() {
+    return {
+      config,
+      simulator: `mobile.html${location.hash}`
+    };
+  }
+};
+</script>
+
+<style lang="less">
+.van-doc-intro {
+  padding-top: 20px;
+  font-family: "Dosis", "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
+  text-align: center;
+
+  p {
+    margin-bottom: 20px;
+  }
+}
+</style>
--- a/packages/vant-cli/site/desktop/index.html
+++ b/packages/vant-cli/site/desktop/index.html
@ -0,0 +1,13 @@
+<!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, viewport-fit=cover">
+  <meta http-Equiv="Cache-Control" Content="no-cache" />
+  <meta http-Equiv="Pragma" Content="no-cache" />
+  <meta http-Equiv="Expires" Content="0" />
+</head>
+<body ontouchstart>
+  <div id="app"></div>
+</body>
+</html>
--- a/packages/vant-cli/site/desktop/main.js
+++ b/packages/vant-cli/site/desktop/main.js
@ -0,0 +1,38 @@
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+import VantDoc from '@vant/doc';
+import App from './App';
+import routes from './router';
+import { isMobile } from '../common';
+import '../common/iframe-router';
+
+Vue.use(VantDoc);
+Vue.use(VueRouter);
+
+if (isMobile) {
+  location.replace('mobile.html' + location.hash);
+}
+
+const router = new VueRouter({
+  mode: 'hash',
+  routes,
+  scrollBehavior(to) {
+    if (to.hash) {
+      return { selector: to.hash };
+    }
+
+    return { x: 0, y: 0 };
+  }
+});
+
+router.afterEach(() => {
+  Vue.nextTick(() => window.syncPath());
+});
+
+window.vueRouter = router;
+
+new Vue({
+  el: '#app',
+  render: h => h(App),
+  router
+});
--- a/packages/vant-cli/site/desktop/router.js
+++ b/packages/vant-cli/site/desktop/router.js
@ -0,0 +1,24 @@
+import { documents } from '../../dist/desktop-config';
+
+const routes = [];
+const names = Object.keys(documents);
+
+Object.keys(documents).forEach((name, index) => {
+  if (index === 0) {
+    routes.push({
+      path: '*',
+      redirect: () => `/${names[0]}`
+    });
+  }
+
+  routes.push({
+    name,
+    component: documents[name],
+    path: `/${name}`,
+    meta: {
+      name
+    }
+  });
+});
+
+export default routes;
--- a/packages/vant-cli/site/mobile/App.vue
+++ b/packages/vant-cli/site/mobile/App.vue
@ -0,0 +1,34 @@
+<template>
+  <div>
+    <nav-bar />
+    <keep-alive>
+      <router-view />
+    </keep-alive>
+  </div>
+</template>
+
+<script>
+import DemoNav from './components/DemoNav';
+
+export default {
+  components: {
+    DemoNav
+  }
+};
+</script>
+
+<style lang="less">
+body {
+  min-width: 100vw;
+  color: #323233;
+  font-family: 'PingFang SC', Helvetica, Tohoma, Arial, sans-serif;
+  line-height: 1;
+  background-color: #f8f8f8;
+  -webkit-font-smoothing: antialiased;
+}
+
+::-webkit-scrollbar {
+  width: 0;
+  background: transparent;
+}
+</style>
--- a/packages/vant-cli/site/mobile/components/DemoBlock.vue
+++ b/packages/vant-cli/site/mobile/components/DemoBlock.vue
@ -0,0 +1,36 @@
+<template>
+  <section class="van-doc-demo-block">
+    <h2 class="van-doc-demo-block__title">{{ title }}</h2>
+    <slot />
+  </section>
+</template>
+
+<script>
+export default {
+  name: 'demo-block',
+
+  props: {
+    title: String
+  }
+};
+</script>
+
+<style lang="less">
+@import '../style/variable';
+
+.van-doc-demo-block {
+  &__title {
+    margin: 0;
+    padding: 32px 16px 16px;
+    color: @van-doc-text-light-blue;
+    font-weight: normal;
+    font-size: 14px;
+  }
+
+  &:first-of-type {
+    .van-doc-demo-block__title {
+      padding-top: 20px;
+    }
+  }
+}
+</style>
--- a/packages/vant-cli/site/mobile/components/DemoNav.vue
+++ b/packages/vant-cli/site/mobile/components/DemoNav.vue
@ -0,0 +1,58 @@
+<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">
+      <path fill="#969799" fill-rule="evenodd" :d="path" />
+    </svg>
+  </div>
+</template>
+
+<script>
+/* eslint-disable max-len */
+export default {
+  data() {
+    return {
+      path:
+        'M296.114 508.035c-3.22-13.597.473-28.499 11.079-39.105l333.912-333.912c16.271-16.272 42.653-16.272 58.925 0s16.272 42.654 0 58.926L395.504 498.47l304.574 304.574c16.272 16.272 16.272 42.654 0 58.926s-42.654 16.272-58.926 0L307.241 528.058a41.472 41.472 0 0 1-11.127-20.023z'
+    };
+  },
+
+  computed: {
+    title() {
+      const { name } = this.$route.meta || {};
+      return name ? name.replace(/-/g, '') : '';
+    }
+  },
+
+  methods: {
+    onBack() {
+      history.back();
+    }
+  }
+};
+</script>
+
+<style lang="less">
+.van-doc-demo-nav {
+  position: relative;
+  height: 56px;
+  line-height: 56px;
+  text-align: center;
+  background-color: #fff;
+
+  &__title {
+    font-weight: 500;
+    font-size: 17px;
+    text-transform: capitalize;
+  }
+
+  &__back {
+    position: absolute;
+    top: 16px;
+    left: 16px;
+    width: 24px;
+    height: 24px;
+    cursor: pointer;
+  }
+}
+</style>
--- a/packages/vant-cli/site/mobile/components/DemoSection.vue
+++ b/packages/vant-cli/site/mobile/components/DemoSection.vue
@ -0,0 +1,32 @@
+<template>
+  <section class="van-doc-demo-section" :class="demoName">
+    <slot />
+  </section>
+</template>
+
+<script>
+import decamelize from 'decamelize';
+
+export default {
+  name: 'demo-section',
+
+  computed: {
+    demoName() {
+      const { meta } = this.$route;
+      if (meta && meta.name) {
+        return `demo-${decamelize(meta.name, '-')}`;
+      }
+
+      return '';
+    }
+  }
+};
+</script>
+
+<style lang="less">
+.van-doc-demo-section {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding-bottom: 20px;
+}
+</style>
--- a/packages/vant-cli/site/mobile/index.html
+++ b/packages/vant-cli/site/mobile/index.html
@ -0,0 +1,13 @@
+<!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, viewport-fit=cover">
+  <meta http-Equiv="Cache-Control" Content="no-cache" />
+  <meta http-Equiv="Pragma" Content="no-cache" />
+  <meta http-Equiv="Expires" Content="0" />
+</head>
+<body ontouchstart>
+  <div id="app"></div>
+</body>
+</html>
--- a/packages/vant-cli/site/mobile/main.js
+++ b/packages/vant-cli/site/mobile/main.js
@ -0,0 +1,30 @@
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+import DemoBlock from './components/DemoBlock';
+import DemoSection from './components/DemoSection';
+import routes from './router';
+import App from './App';
+import '@vant/touch-emulator';
+import '../common/iframe-router';
+
+Vue.use(VueRouter);
+Vue.component(DemoBlock.name, DemoBlock);
+Vue.component(DemoSection.name, DemoSection);
+
+const router = new VueRouter({
+  mode: 'hash',
+  routes,
+  scrollBehavior: (to, from, savedPosition) => savedPosition || { x: 0, y: 0 }
+});
+
+router.afterEach(() => {
+  Vue.nextTick(window.syncPath);
+});
+
+window.vueRouter = router;
+
+new Vue({
+  el: '#app',
+  render: h => h(App),
+  router
+});
--- a/packages/vant-cli/site/mobile/router.js
+++ b/packages/vant-cli/site/mobile/router.js
@ -0,0 +1,24 @@
+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({
+    name,
+    component: demos[name],
+    path: `/${name}`,
+    meta: {
+      name
+    }
+  });
+});
+
+export default routes;
--- a/packages/vant-cli/src/commands/build.ts
+++ b/packages/vant-cli/src/commands/build.ts
@ -0,0 +1,54 @@
+import { join } from 'path';
+import { remove, copy, readdirSync } from 'fs-extra';
+import { clean } from './clean';
+import { compileJs } from '../compiler/compile-js';
+import { compileSfc } from '../compiler/compile-sfc';
+import { compileStyle } from '../compiler/compile-style';
+import { SRC_DIR, LIB_DIR, ES_DIR } from '../common/constant';
+import {
+  isDir,
+  isSfc,
+  isDemoDir,
+  isTestDir,
+  isScript,
+  isStyle
+} from '../common';
+
+async function compileDir(dir: string) {
+  const files = readdirSync(dir);
+
+  files.forEach(async filename => {
+    const filePath = join(dir, filename);
+
+    if (isDemoDir(filePath) || isTestDir(filePath)) {
+      await remove(filePath);
+    } else if (isDir(filePath)) {
+      await compileDir(filePath);
+    } else if (isSfc(filePath)) {
+      await compileSfc(filePath);
+    } else if (isScript(filePath)) {
+      await compileJs(filePath);
+    } else if (isStyle(filePath)) {
+      await compileStyle(filePath);
+    } else {
+      await remove(filePath);
+    }
+  });
+}
+
+function setModuleEnv(value: string) {
+  process.env.BABEL_MODULE = value;
+}
+
+export async function build() {
+  clean();
+
+  await copy(SRC_DIR, ES_DIR);
+  await copy(SRC_DIR, LIB_DIR);
+
+  setModuleEnv('esmodule');
+  await compileDir(ES_DIR);
+
+  setModuleEnv('commonjs');
+  await compileDir(LIB_DIR);
+}
--- a/packages/vant-cli/src/commands/changelog.ts
+++ b/packages/vant-cli/src/commands/changelog.ts
@ -1,11 +1,11 @@
-const path = require('path');
-const shelljs = require('shelljs');
+import { join } from 'path';
+import { exec } from 'shelljs';

-function changelog(dist, cmd) {
+export function changelog(dist: string, cmd: { tag?: string }) {
  const basepath = process.cwd();
  const tag = cmd.tag || 'v1.0.0';

-  shelljs.exec(`
+  exec(`
    basepath=${basepath}

    github_changelog_generator \
@ -18,9 +18,6 @@ function changelog(dist, cmd) {
      --no-author \
      --no-unreleased \
      --since-tag ${tag} \
-      -o ${path.join(basepath, dist)}
-    `
-  );
+      -o ${join(basepath, dist)}
+    `);
 }
-
-module.exports = changelog;
--- a/packages/vant-cli/src/commands/clean.ts
+++ b/packages/vant-cli/src/commands/clean.ts
@ -0,0 +1,8 @@
+import { emptyDirSync } from 'fs-extra';
+import { ES_DIR, LIB_DIR, DIST_DIR } from '../common/constant';
+
+export function clean() {
+  emptyDirSync(ES_DIR);
+  emptyDirSync(LIB_DIR);
+  emptyDirSync(DIST_DIR);
+}
--- a/packages/vant-cli/src/commands/commit-lint.ts
+++ b/packages/vant-cli/src/commands/commit-lint.ts
@ -1,11 +1,11 @@
-const fs = require('fs');
-const signale = require('signale');
+import signale from 'signale';
+import { readFileSync } from 'fs';

 const commitRE = /^(revert: )?(fix|feat|docs|perf|test|types|build|chore|refactor|breaking change)(\(.+\))?: .{1,50}/;

-function commitLint() {
-  const gitParams = process.env.HUSKY_GIT_PARAMS;
-  const commitMsg = fs.readFileSync(gitParams, 'utf-8').trim();
+export function commitLint() {
+  const gitParams = process.env.HUSKY_GIT_PARAMS as string;
+  const commitMsg = readFileSync(gitParams, 'utf-8').trim();

  if (!commitRE.test(commitMsg)) {
    signale.error(`Error: invalid commit message: "${commitMsg}".
@ -34,5 +34,3 @@ Allowed Types:
    process.exit(1);
  }
 }
-
-module.exports = commitLint;
--- a/packages/vant-cli/src/commands/dev.ts
+++ b/packages/vant-cli/src/commands/dev.ts
@ -0,0 +1,39 @@
+import webpack from 'webpack';
+import WebpackDevServer from 'webpack-dev-server';
+import webpackDevConfig from '../config/webpack.site.dev';
+import { getPort } from 'portfinder';
+import { clean } from '../commands/clean';
+import { genMobileConfig } from '../compiler/gen-mobile-config';
+import { genDesktopConfig } from '../compiler/gen-desktop-config';
+
+function runWebpack() {
+  const server = new WebpackDevServer(
+    webpack(webpackDevConfig),
+    (webpackDevConfig as any).devServer
+  );
+
+  getPort(
+    {
+      port: 8080
+    },
+    (err, port) => {
+      if (err) {
+        console.log(err);
+        return;
+      }
+
+      server.listen(port, 'localhost', (err?: Error) => {
+        if (err) {
+          console.log(err);
+        }
+      });
+    }
+  );
+}
+
+export function dev() {
+  clean();
+  genMobileConfig();
+  genDesktopConfig();
+  runWebpack();
+}
--- a/packages/vant-cli/src/commands/lint.ts
+++ b/packages/vant-cli/src/commands/lint.ts
@ -0,0 +1,48 @@
+import { start, error, success } from 'signale';
+import { lint as stylelint } from 'stylelint';
+import { CLIEngine } from 'eslint';
+
+function lintScript() {
+  start('ESLint Start');
+
+  const cli = new CLIEngine({
+    fix: true,
+    extensions: ['.js', '.jsx', '.vue', '.ts', '.tsx']
+  });
+
+  const report = cli.executeOnFiles(['src/']);
+  const formatter = cli.getFormatter();
+
+  CLIEngine.outputFixes(report);
+
+  // output lint errors
+  const formatted = formatter(report.results);
+  if (formatted) {
+    error('ESLint Failed');
+    console.log(formatter(report.results));
+  } else {
+    success('ESLint Passed');
+  }
+}
+
+function lintStyle() {
+  start('Stylelint Start');
+
+  stylelint({
+    fix: true,
+    formatter: 'string',
+    files: ['src/**/*.css', 'src/**/*.less', 'src/**/*.scss', 'src/**/*.vue']
+  }).then(result => {
+    if (result.errored) {
+      error('Stylelint Failed');
+      console.log(result.output);
+    } else {
+      success('Stylelint Passed');
+    }
+  });
+}
+
+export function lint() {
+  lintScript();
+  lintStyle();
+}
--- a/packages/vant-cli/src/commands/release.ts
+++ b/packages/vant-cli/src/commands/release.ts
@ -0,0 +1,14 @@
+/* eslint-disable no-template-curly-in-string */
+import { build } from './build';
+// @ts-ignore
+import releaseIt from 'release-it';
+
+export async function release() {
+  await build();
+  await releaseIt({
+    git: {
+      tagName: 'v${version}',
+      commitMessage: 'chore: release ${version}'
+    }
+  });
+}
--- a/packages/vant-cli/src/commands/test.ts
+++ b/packages/vant-cli/src/commands/test.ts
@ -0,0 +1,14 @@
+import { runCLI } from 'jest';
+import { CWD, JEST_CONFIG_FILE } from '../common/constant';
+
+export function test(command: any) {
+  process.env.NODE_ENV = 'test';
+
+  const config = {
+    rootDir: CWD,
+    watch: command.watch,
+    config: JEST_CONFIG_FILE
+  } as any;
+
+  runCLI(config, [CWD]);
+}
--- a/packages/vant-cli/src/common/constant.ts
+++ b/packages/vant-cli/src/common/constant.ts
@ -0,0 +1,17 @@
+import { join } from 'path';
+
+export const CWD = process.cwd();
+export const SRC_DIR = join(CWD, 'src');
+export const CONFIG_FILE = join(CWD, 'components.config.js');
+export const ES_DIR = join(CWD, 'es');
+export const LIB_DIR = join(CWD, 'lib');
+export const DIST_DIR = join(__dirname, '../../dist');
+export const CONFIG_DIR = join(__dirname, '../config');
+export const MOBILE_CONFIG_FILE = join(DIST_DIR, 'mobile-config.js');
+export const DESKTOP_CONFIG_FILE = join(DIST_DIR, 'desktop-config.js');
+export const BABEL_CONFIG_FILE = join(CONFIG_DIR, 'babel.config.js');
+export const JEST_CONFIG_FILE = join(CONFIG_DIR, 'jest.config.js');
+export const JEST_FILE_MOCK_FILE = join(CONFIG_DIR, 'jest.file-mock.js');
+export const JEST_STYLE_MOCK_FILE = join(CONFIG_DIR, 'jest.style-mock.js');
+export const JEST_TRANSFORM_FILE = join(CONFIG_DIR, 'jest.transform.js');
+export const POSTCSS_CONFIG_FILE = join(CONFIG_DIR, 'postcss.config.js');
--- a/packages/vant-cli/src/common/index.ts
+++ b/packages/vant-cli/src/common/index.ts
@ -0,0 +1,67 @@
+import fs from 'fs-extra';
+import { join } from 'path';
+import { SRC_DIR } from './constant';
+
+export const EXT_REGEXP = /\.\w+$/;
+export const SFC_REGEXP = /\.(vue)$/;
+export const DEMO_REGEXP = /\/demo$/;
+export const TEST_REGEXP = /\/test$/;
+export const STYLE_REGEXP = /\.(css|less|scss)$/;
+export const SCRIPT_REGEXP = /\.(js|ts|jsx|tsx)$/;
+export const ENTRY_EXTS = ['js', 'ts', 'tsx', 'jsx', 'vue'];
+
+export function removeExt(path: string) {
+  return path.replace('.js', '');
+}
+
+export function replaceExt(path: string, ext: string) {
+  return path.replace(EXT_REGEXP, ext);
+}
+
+export function getComponents() {
+  const EXCLUDES = ['.DS_Store'];
+  const dirs = fs.readdirSync(SRC_DIR);
+  return dirs
+    .filter(dir => !EXCLUDES.includes(dir))
+    .filter(dir =>
+      ENTRY_EXTS.some(ext => fs.existsSync(join(SRC_DIR, dir, `index.${ext}`)))
+    );
+}
+
+export function isDir(dir: string) {
+  return fs.lstatSync(dir).isDirectory();
+}
+
+export function isDemoDir(dir: string) {
+  return DEMO_REGEXP.test(dir);
+}
+
+export function isTestDir(dir: string) {
+  return TEST_REGEXP.test(dir);
+}
+
+export function isSfc(path: string) {
+  return SFC_REGEXP.test(path);
+}
+
+export function isStyle(path: string) {
+  return STYLE_REGEXP.test(path);
+}
+
+export function isScript(path: string) {
+  return SCRIPT_REGEXP.test(path);
+}
+
+const camelizeRE = /-(\w)/g;
+const pascalizeRE = /(\w)(\w*)/g;
+
+export function camelize(str: string): string {
+  return str.replace(camelizeRE, (_, c) => c.toUpperCase());
+}
+
+export function pascalize(str: string): string {
+  return camelize(str).replace(
+    pascalizeRE,
+    (_, c1, c2) => c1.toUpperCase() + c2
+  );
+}
--- a/packages/vant-cli/src/compiler/compile-js.ts
+++ b/packages/vant-cli/src/compiler/compile-js.ts
@ -0,0 +1,14 @@
+import { transformFileSync } from '@babel/core';
+import { removeSync, outputFileSync } from 'fs-extra';
+import { replaceExt } from '../common';
+
+export function compileJs(filePath: string) {
+  const result = transformFileSync(filePath);
+
+  if (result) {
+    const jsFilePath = replaceExt(filePath, '.js');
+
+    removeSync(filePath);
+    outputFileSync(jsFilePath, result.code);
+  }
+}
--- a/packages/vant-cli/src/compiler/compile-sfc.ts
+++ b/packages/vant-cli/src/compiler/compile-sfc.ts
@ -0,0 +1,100 @@
+import * as compiler from 'vue-template-compiler';
+import * as compileUtils from '@vue/component-compiler-utils';
+import { parse } from 'path';
+import { removeSync, writeFileSync, readFileSync } from 'fs-extra';
+import { replaceExt } from '../common';
+import { compileJs } from './compile-js';
+import { compileStyle } from './compile-style';
+
+const RENDER_FN = '__vue_render__';
+const STATIC_RENDER_FN = '__vue_staticRenderFns__';
+const EXPORT = 'export default {';
+
+// trim some unused code
+function trim(code: string) {
+  return code.replace(/\/\/\n/g, '').trim();
+}
+
+// inject render fn to script
+function injectRender(script: string, render: string) {
+  script = trim(script);
+
+  render = render
+    .replace('var render', `var ${RENDER_FN}`)
+    .replace('var staticRenderFns', `var ${STATIC_RENDER_FN}`);
+
+  return script.replace(
+    EXPORT,
+    `${render}\n${EXPORT}\n  render: ${RENDER_FN},\n\n  staticRenderFns: ${STATIC_RENDER_FN},\n`
+  );
+}
+
+function injectStyle(
+  script: string,
+  styles: compileUtils.SFCBlock[],
+  filePath: string
+) {
+  if (styles.length) {
+    const imports = styles
+      .map((style, index) => {
+        const prefix = index !== 0 ? `-${index + 1}` : '';
+        const { base } = parse(replaceExt(filePath, `${prefix}.css`));
+        return `import './${base}';`;
+      })
+      .join('\n');
+
+    return script.replace(EXPORT, `${imports}\n\n${EXPORT}`);
+  }
+
+  return script;
+}
+
+function compileTemplate(template: string) {
+  const result = compileUtils.compileTemplate({
+    compiler,
+    source: template,
+    isProduction: true
+  } as any);
+
+  return result.code;
+}
+
+export async function compileSfc(filePath: string) {
+  const source = readFileSync(filePath, 'utf-8');
+  const jsFilePath = replaceExt(filePath, '.js');
+
+  const descriptor = compileUtils.parse({
+    source,
+    compiler,
+    needMap: false
+  } as any);
+
+  const { template, styles } = descriptor;
+
+  removeSync(filePath);
+
+  // compile js part
+  if (descriptor.script) {
+    let script = descriptor.script.content;
+    script = injectStyle(script, styles, filePath);
+
+    if (template) {
+      const render = compileTemplate(template.content);
+      script = injectRender(script, render);
+    }
+
+    writeFileSync(jsFilePath, script);
+    await compileJs(jsFilePath);
+  }
+
+  // compile style part
+  styles.forEach(async (style, index: number) => {
+    const prefix = index !== 0 ? `-${index + 1}` : '';
+    const ext = style.lang || 'css';
+    const cssFilePath = replaceExt(filePath, `${prefix}.${ext}`);
+
+    writeFileSync(cssFilePath, trim(style.content));
+
+    await compileStyle(cssFilePath);
+  });
+}
--- a/packages/vant-cli/src/compiler/compile-style.ts
+++ b/packages/vant-cli/src/compiler/compile-style.ts
@ -0,0 +1,46 @@
+import postcss from 'postcss';
+import postcssrc from 'postcss-load-config';
+import { parse } from 'path';
+import { render as renderLess } from 'less';
+import { renderSync as renderSass } from 'sass';
+import { readFileSync, writeFileSync } from 'fs';
+import { replaceExt } from '../common';
+import { POSTCSS_CONFIG_FILE } from '../common/constant';
+
+async function compilePostcss(filePath: string, source: string | Buffer) {
+  const config = await postcssrc({}, POSTCSS_CONFIG_FILE);
+  const output = await postcss(config.plugins as any).process(source, {
+    from: undefined
+  });
+
+  writeFileSync(filePath, output);
+}
+
+async function compileLess(filePath: string) {
+  const source = readFileSync(filePath, 'utf-8');
+  const { css } = await renderLess(source, {
+    filename: filePath
+  });
+
+  return css;
+}
+
+async function compileSass(filePath: string) {
+  const { css } = renderSass({ file: filePath });
+  return css;
+}
+
+export async function compileStyle(filePath: string) {
+  const parsedPath = parse(filePath);
+
+  if (parsedPath.ext === '.less') {
+    const source = await compileLess(filePath);
+    await compilePostcss(replaceExt(filePath, '.css'), source);
+  } else if (parsedPath.ext === '.scss') {
+    const source = await compileSass(filePath);
+    await compilePostcss(replaceExt(filePath, '.css'), source);
+  } else {
+    const source = readFileSync(filePath, 'utf-8');
+    await compilePostcss(filePath, source);
+  }
+}
--- a/packages/vant-cli/src/compiler/gen-desktop-config.ts
+++ b/packages/vant-cli/src/compiler/gen-desktop-config.ts
@ -0,0 +1,55 @@
+import { join, relative } from 'path';
+import { existsSync, writeFileSync } from 'fs-extra';
+import { pascalize, removeExt, getComponents } from '../common';
+import {
+  SRC_DIR,
+  CONFIG_FILE,
+  DIST_DIR,
+  DESKTOP_CONFIG_FILE
+} from '../common/constant';
+
+function checkDocumentExists(component: string) {
+  const absolutePath = join(SRC_DIR, component, 'README.md');
+  return existsSync(absolutePath);
+}
+
+function genImportDocuments(components: string[]) {
+  return components
+    .filter(component => checkDocumentExists(component))
+    .map(component => {
+      const absolutePath = join(SRC_DIR, component, 'README.md');
+      const relativePath = relative(DIST_DIR, absolutePath);
+      return `import ${pascalize(component)} from '${relativePath}';`;
+    })
+    .join('\n');
+}
+
+function genExportDocuments(components: string[]) {
+  return `export const documents = {
+  ${components
+    .filter(component => checkDocumentExists(component))
+    .map(component => pascalize(component))
+    .join(',\n  ')}
+};`;
+}
+
+function genImportConfig() {
+  const configRelative = relative(DIST_DIR, CONFIG_FILE);
+  return `import config from '${removeExt(configRelative)}';`;
+}
+
+function genExportConfig() {
+  return 'export { config };';
+}
+
+export function genDesktopConfig() {
+  const components = getComponents();
+  const code = `${genImportConfig()}
+${genImportDocuments(components)}
+
+${genExportConfig()}
+${genExportDocuments(components)}
+`;
+
+  writeFileSync(DESKTOP_CONFIG_FILE, code);
+}
--- a/packages/vant-cli/src/compiler/gen-mobile-config.ts
+++ b/packages/vant-cli/src/compiler/gen-mobile-config.ts
@ -0,0 +1,42 @@
+import { join, relative } from 'path';
+import { existsSync, ensureDirSync, writeFileSync } from 'fs-extra';
+import { pascalize, removeExt, getComponents } from '../common';
+import { SRC_DIR, DIST_DIR, MOBILE_CONFIG_FILE } from '../common/constant';
+
+function checkDemoExists(component: string) {
+  const absolutePath = join(SRC_DIR, component, 'demo/index.vue');
+  return existsSync(absolutePath);
+}
+
+function genImports(components: string[]) {
+  return components
+    .filter(component => checkDemoExists(component))
+    .map(component => {
+      const absolutePath = join(SRC_DIR, component, 'demo/index.vue');
+      const relativePath = relative(DIST_DIR, absolutePath);
+
+      return `import ${pascalize(component)} from '${removeExt(
+        relativePath
+      )}';`;
+    })
+    .join('\n');
+}
+
+function genExports(components: string[]) {
+  return `export const demos = {\n  ${components
+    .filter(component => checkDemoExists(component))
+    .map(component => pascalize(component))
+    .join(',\n  ')}\n};`;
+}
+
+function genCode(components: string[]) {
+  return `${genImports(components)}\n\n${genExports(components)}\n`;
+}
+
+export function genMobileConfig() {
+  const components = getComponents();
+  const code = genCode(components);
+
+  ensureDirSync(DIST_DIR);
+  writeFileSync(MOBILE_CONFIG_FILE, code);
+}
--- a/packages/vant-cli/src/config/babel.config.ts
+++ b/packages/vant-cli/src/config/babel.config.ts
@ -0,0 +1,42 @@
+module.exports = function(api: any) {
+  const { BABEL_MODULE, NODE_ENV } = process.env;
+
+  const isTest = NODE_ENV === 'test';
+  const useESModules = BABEL_MODULE !== 'commonjs' && !isTest;
+
+  api && api.cache(false);
+
+  return {
+    presets: [
+      [
+        '@babel/preset-env',
+        {
+          loose: true,
+          modules: useESModules ? false : 'commonjs'
+        }
+      ],
+      [
+        '@vue/babel-preset-jsx',
+        {
+          functional: false
+        }
+      ],
+      '@babel/preset-typescript'
+    ],
+    plugins: [
+      [
+        '@babel/plugin-transform-runtime',
+        {
+          corejs: false,
+          helpers: true,
+          regenerator: isTest,
+          useESModules
+        }
+      ],
+      '@babel/plugin-transform-object-assign',
+      '@babel/plugin-proposal-optional-chaining'
+    ]
+  };
+};
+
+export default module.exports;
--- a/packages/vant-cli/src/config/jest.config.ts
+++ b/packages/vant-cli/src/config/jest.config.ts
@ -0,0 +1,28 @@
+import {
+  JEST_FILE_MOCK_FILE,
+  JEST_STYLE_MOCK_FILE
+} from '../common/constant';
+
+module.exports = {
+  moduleNameMapper: {
+    '\\.(css|less|scss)$': JEST_STYLE_MOCK_FILE,
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': JEST_FILE_MOCK_FILE
+  },
+  moduleFileExtensions: ['js', 'jsx', 'vue', 'ts', 'tsx'],
+  transform: {
+    '\\.(vue)$': 'vue-jest',
+    '\\.(js|jsx|ts|tsx)$': 'babel-jest'
+  },
+  transformIgnorePatterns: ['node_modules/(?!(vant|@babel\\/runtime)/)'],
+  snapshotSerializers: ['jest-serializer-vue'],
+  collectCoverageFrom: [
+    'src/**/*.{js,jsx,ts,tsx,vue}',
+    '!**/style/**',
+    '!**/demo/**',
+    '!**/locale/lang/**',
+    '!**/sku/**'
+  ],
+  collectCoverage: true,
+  coverageReporters: ['html', 'lcov', 'text-summary'],
+  coverageDirectory: './test/coverage'
+};
--- a/packages/vant-cli/src/config/jest.file-mock.ts
+++ b/packages/vant-cli/src/config/jest.file-mock.ts
@ -0,0 +1 @@
+module.exports = 'test-file-stub';
--- a/packages/vant-cli/src/config/jest.style-mock.ts
+++ b/packages/vant-cli/src/config/jest.style-mock.ts
@ -0,0 +1 @@
+module.exports = {};
--- a/packages/vant-cli/src/config/postcss.config.ts
+++ b/packages/vant-cli/src/config/postcss.config.ts
@ -0,0 +1,5 @@
+module.exports = {
+  plugins: {
+    autoprefixer: {}
+  }
+};
--- a/packages/vant-cli/src/config/webpack.base.ts
+++ b/packages/vant-cli/src/config/webpack.base.ts
@ -0,0 +1,78 @@
+
+import sass from 'sass';
+import { VueLoaderPlugin } from 'vue-loader';
+import { POSTCSS_CONFIG_FILE } from '../common/constant';
+
+const CSS_LOADERS = [
+  'style-loader',
+  'css-loader',
+  {
+    loader: 'postcss-loader',
+    options: {
+      config: {
+        path: POSTCSS_CONFIG_FILE
+      }
+    }
+  }
+];
+
+module.exports = {
+  mode: 'development',
+  resolve: {
+    extensions: ['.js', '.ts', '.tsx', '.jsx', '.vue', '.less']
+  },
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        use: [
+          {
+            loader: 'vue-loader',
+            options: {
+              compilerOptions: {
+                preserveWhitespace: false
+              }
+            }
+          }
+        ]
+      },
+      {
+        test: /\.(js|ts|jsx|tsx)$/,
+        exclude: /node_modules\/(?!(@youzan\/create-vue-components))/,
+        use: {
+          loader: 'babel-loader'
+        }
+      },
+      {
+        test: /\.css$/,
+        sideEffects: true,
+        use: CSS_LOADERS
+      },
+      {
+        test: /\.less$/,
+        sideEffects: true,
+        use: [...CSS_LOADERS, 'less-loader']
+      },
+      {
+        test: /\.scss$/,
+        sideEffects: true,
+        use: [
+          ...CSS_LOADERS,
+          {
+            loader: 'sass-loader',
+            options: {
+              implementation: sass
+            }
+          }
+        ]
+      },
+      {
+        test: /\.md$/,
+        use: ['vue-loader', '@vant/markdown-loader']
+      }
+    ]
+  },
+  plugins: [new VueLoaderPlugin()]
+};
+
+export default module.exports;
--- a/packages/vant-cli/src/config/webpack.site.dev.ts
+++ b/packages/vant-cli/src/config/webpack.site.dev.ts
@ -0,0 +1,48 @@
+import { join } from 'path';
+import merge from 'webpack-merge';
+import config from './webpack.base';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+
+module.exports = merge(config, {
+  entry: {
+    'site-desktop': join(__dirname, '../../site/desktop/main.js'),
+    'site-mobile': join(__dirname, '../../site/mobile/main.js')
+  },
+  devServer: {
+    open: true,
+    host: '0.0.0.0',
+    stats: 'errors-only',
+    disableHostCheck: true,
+  },
+  output: {
+    path: join(__dirname, '../../site/dist'),
+    publicPath: '/',
+    chunkFilename: 'async_[name].js'
+  },
+  optimization: {
+    splitChunks: {
+      cacheGroups: {
+        chunks: {
+          chunks: 'all',
+          minChunks: 2,
+          minSize: 0,
+          name: 'chunks'
+        }
+      }
+    }
+  },
+  plugins: [
+    new HtmlWebpackPlugin({
+      chunks: ['chunks', 'site-desktop'],
+      template: join(__dirname, '../../site/desktop/index.html'),
+      filename: 'index.html'
+    }),
+    new HtmlWebpackPlugin({
+      chunks: ['chunks', 'site-mobile'],
+      template: join(__dirname, '../../site/mobile/index.html'),
+      filename: 'mobile.html'
+    })
+  ]
+});
+
+export default module.exports;
--- a/packages/vant-cli/src/config/webpack.site.prd.ts
+++ b/packages/vant-cli/src/config/webpack.site.prd.ts
@ -0,0 +1,15 @@
+import { join } from 'path';
+import merge from 'webpack-merge';
+import config from './webpack.site.dev';
+
+module.exports = merge(config, {
+  mode: 'production',
+  output: {
+    path: join(__dirname, '../../site/dist'),
+    publicPath: 'https://b.yzcdn.cn/vant/',
+    filename: '[name].[hash:8].js',
+    chunkFilename: 'async_[name].[chunkhash:8].js'
+  }
+});
+
+export default module.exports;
--- a/packages/vant-cli/src/index.js
+++ b/packages/vant-cli/src/index.js
@ -1,16 +0,0 @@
-#!/usr/bin/env node
-
-const commander = require('commander');
-const changelog = require('./changelog');
-const commitLint = require('./commit-lint');
-
-commander
-  .command('changelog <dir>')
-  .option('--tag [tag]', 'Since tag')
-  .action(changelog);
-
-commander
-  .command('commit-lint')
-  .action(commitLint);
-
-commander.parse(process.argv);
--- a/packages/vant-cli/src/index.ts
+++ b/packages/vant-cli/src/index.ts
@ -0,0 +1,33 @@
+#!/usr/bin/env node
+
+import { command, parse } from 'commander';
+import { dev } from './commands/dev';
+import { test } from './commands/test';
+import { lint } from './commands/lint';
+import { clean } from './commands/clean';
+import { build } from './commands/build';
+import { release } from './commands/release';
+import { changelog } from './commands/changelog';
+import { commitLint } from './commands/commit-lint';
+
+command('dev').action(dev);
+
+command('lint').action(lint);
+
+command('clean').action(clean);
+
+command('build').action(build);
+
+command('release').action(release);
+
+command('changelog <dir>')
+  .option('--tag [tag]', 'Since tag')
+  .action(changelog);
+
+command('commit-lint').action(commitLint);
+
+command('test')
+  .option('--watch')
+  .action(test);
+
+parse(process.argv);
--- a/packages/vant-cli/tsconfig.json
+++ b/packages/vant-cli/tsconfig.json
@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "outDir": "./lib",
+    "module": "commonjs",
+    "strict": true,
+    "declaration": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "lib": ["esnext", "dom"]
+  },
+  "include": ["src/**/*", "site"]
+}
--- a/packages/vant-cli/yarn.lock
+++ b/packages/vant-cli/yarn.lock
--- a/packages/vant-doc/src/VanDoc.vue
+++ b/packages/vant-doc/src/VanDoc.vue
@ -2,7 +2,6 @@
  <div class="van-doc">
    <van-doc-header
      :lang="lang"
-      :github="github"
      :versions="versions"
      :config="config.header"
      :search-config="searchConfig"
@ -30,7 +29,6 @@ export default {

  props: {
    lang: String,
-    github: String,
    versions: Array,
    searchConfig: Object,
    currentSimulator: Number,
--- a/packages/vant-doc/src/component/Header.vue
+++ b/packages/vant-doc/src/component/Header.vue
@ -53,7 +53,6 @@ export default {
  props: {
    lang: String,
    config: Object,
-    github: String,
    versions: Array,
    searchConfig: Object
  },
--- a/yarn.lock
+++ b/yarn.lock
@ -1398,8 +1398,8 @@

 "@vant/cli@^1.0.6":
  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/@vant/cli/-/cli-1.0.6.tgz#05f0836107431f7358d59fc3d22a512f6fec13f8"
-  integrity sha512-WC9ZFWIcwqlxtVA9gEzSqkpxL9sirNCmYUTRfkHvkZ70GNG4WPlyx9uHQlBbaM+Bv6zbDp5goG0mTXsCfGq5Aw==
+  resolved "https://registry.npm.taobao.org/@vant/cli/download/@vant/cli-1.0.6.tgz#05f0836107431f7358d59fc3d22a512f6fec13f8"
+  integrity sha1-BfCDYQdDH3NY1Z/D0ipRL2/sE/g=
  dependencies:
    commander "^2.17.1"
    husky "^3.0.4"