From 33e58a247853d1b90d57004628ffeb6d5d61fe6b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Thu, 9 Aug 2018 17:24:06 +0800
Subject: [PATCH] [Doc] add intro document

---
 changelog.md => docs/markdown/changelog.md |   0
 docs/markdown/intro.md                     |  33 ++++++
 docs/markdown/quickstart.md                | 117 +++++++++++++++++++++
 packages/{row => col}/README.md            |   0
 scripts/release.sh                         |  39 -------
 5 files changed, 150 insertions(+), 39 deletions(-)
 rename changelog.md => docs/markdown/changelog.md (100%)
 create mode 100644 docs/markdown/intro.md
 create mode 100644 docs/markdown/quickstart.md
 rename packages/{row => col}/README.md (100%)
 delete mode 100644 scripts/release.sh

diff --git a/changelog.md b/docs/markdown/changelog.md
similarity index 100%
rename from changelog.md
rename to docs/markdown/changelog.md
diff --git a/docs/markdown/intro.md b/docs/markdown/intro.md
new file mode 100644
index 00000000..c43a2e62
--- /dev/null
+++ b/docs/markdown/intro.md
@@ -0,0 +1,33 @@
+<div class="van-doc-intro">
+  <img class="van-doc-intro__youzan" src="//img.yzcdn.cn/public_files/2017/02/09/e84aa8cbbf7852688c86218c1f3bbf17.png">
+  <img class="van-doc-intro__logo" src="//img.yzcdn.cn/public_files/2017/12/18/fd78cf6bb5d12e2a119d0576bedfd230.png">
+  <h2>Vant Weapp</h2>
+  <p>轻量、可靠的小程序 UI 组件库</p>
+</div>
+ 
+### 特性
+
+* 与 Vant 遵循同套视觉规范
+* 与 Vant 提供一致的 API 接口
+* 完善的文档和示例
+* 快速迭代升级
+
+### 快速上手
+
+请参考 [快速上手](#/quickstart)
+
+### 贡献代码
+
+使用过程中发现任何问题都可以提 [Issue](https://github.com/youzan/vant-weapp/issues) 给我们，当然，我们也非常欢迎你给我们发 [PR](https://github.com/youzan/vant-weapp/pulls)
+
+### 链接
+
+* [意见反馈](https://github.com/youzan/vant-weapp/issues)
+* [加入我们](https://job.youzan.com)
+* [更新日志](#/changelog)
+* [Vue 组件库](https://github.com/youzan/vant)
+* [React 组件库](https://www.youzanyun.com/zanui/zent)
+
+### 开源协议
+
+本项目基于 [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) 协议，请自由地享受和参与开源
diff --git a/docs/markdown/quickstart.md b/docs/markdown/quickstart.md
new file mode 100644
index 00000000..39d98202
--- /dev/null
+++ b/docs/markdown/quickstart.md
@@ -0,0 +1,117 @@
+## 快速上手
+
+### 脚手架
+
+我们提供了开箱即用的开发脚手架，通过 [vue-cli](https://github.com/vuejs/vue-cli) 即可快速创建一个基于 `Vant` 的项目。
+
+```shell
+vue init youzan/vue-cli-template-vant my-project
+```
+
+### 安装
+
+#### NPM
+
+```shell
+npm i vant -S
+```
+
+#### YARN
+
+```shell
+yarn add vant
+```
+
+#### CDN
+
+访问下面的文件 URL，会自动重定向至最新版本的 CDN 链接，建议使用固定版本的 CDN 链接，避免升级时受到非兼容性更新的影响。
+
+```html
+<!-- 引入样式 -->
+<link rel="stylesheet" href="https://unpkg.com/vant/lib/vant-css/index.css">
+
+<!-- 引入组件 -->
+<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
+<script src="https://unpkg.com/vant/lib/vant.min.js"></script>
+```
+
+### 引入组件
+
+#### 方式一. 使用 [babel-plugin-import](https://github.com/ant-design/babel-plugin-import) (推荐)
+
+`babel-plugin-import` 是一款 babel 插件，它会在编译过程中将 import 的写法自动转换为按需引入的方式
+
+```bash
+# 安装 babel-plugin-import 插件
+npm i babel-plugin-import -D
+```
+
+```js
+// 在 .babelrc 或 babel-loader 中添加插件配置
+// 注意：webpack 1 无需设置 libraryDirectory
+{
+  "plugins": [
+    ["import", {
+      "libraryName": "vant",
+      "libraryDirectory": "es",
+      "style": true
+    }]
+  ]
+}
+```
+
+接着你可以在代码中直接引入 Vant 组件，插件会自动将代码转化为方式二中的按需引入形式
+
+```js
+import { Button, Cell } from 'vant';
+```
+
+> 如果你在使用 TypeScript，可以使用 [ts-import-plugin](https://github.com/Brooooooklyn/ts-import-plugin) 实现按需引入
+
+#### 方式二. 按需引入组件
+
+在不使用插件的情况下，可以手动引入需要的组件
+
+```js
+import Button from 'vant/lib/button';
+import 'vant/lib/vant-css/base.css';
+import 'vant/lib/vant-css/button.css';
+```
+ 
+#### 方式三. 导入所有组件
+
+```js
+import Vue from 'vue';
+import Vant from 'vant';
+import 'vant/lib/vant-css/index.css';
+
+Vue.use(Vant);
+```
+
+> 注意：配置 babel-plugin-import 插件后将不允许导入所有组件
+
+
+### Rem 适配
+
+Vant 中的样式默认使用`px`作为单位，如果需要使用`rem`单位，推荐使用以下两个工具
+
+- [postcss-pxtorem](https://github.com/cuth/postcss-pxtorem) 是一款 postcss 插件，用于将单位转化为 rem
+- [lib-flexible](https://github.com/amfe/lib-flexible) 用于设置 rem 基准值
+
+下面提供了一份基本的 postcss 配置，可以在此配置的基础上根据项目需求进行修改
+
+```js
+module.exports = {
+  plugins: {
+    'autoprefixer': {
+      browsers: ['Android >= 4.0', 'iOS >= 7']
+    }
+    'postcss-pxtorem': {
+      rootValue: 37.5,
+      propList: ['*']
+    }
+  }
+}
+```
+
+> 注意：在配置 postcss-loader 时，应避免 ignore node_modules 目录，这会导致 Vant 的样式无法被编译
diff --git a/packages/row/README.md b/packages/col/README.md
similarity index 100%
rename from packages/row/README.md
rename to packages/col/README.md
diff --git a/scripts/release.sh b/scripts/release.sh
deleted file mode 100644
index 56ad5cfe..00000000
--- a/scripts/release.sh
+++ /dev/null
@@ -1,39 +0,0 @@
-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