Merge pull request #74 from chenjiahan/dev

Optimize component building, reduce dist file size

.babelrc

@@ -1,12 +1,9 @@
 {
-  "presets": [
+  "presets": [["env", { "modules": false, "loose": true }]],
-    [
+  "plugins": ["transform-vue-jsx", "transform-runtime", "transform-object-rest-spread"],
-      "es2015",
+  "env": {
-      { "modules": false }
+    "commonjs": {
-    ]
+      "presets": [["env", { "modules": "commonjs", "loose": true }]]
-  ],
+    }
-  "plugins": [
+  }
-    "transform-runtime",
-    "transform-vue-jsx"
-  ]
 }

build/bin/build-all.js

@@ -1,25 +0,0 @@
-'use strict';
-
-const components = require('../../components.json');
-const execSync = require('child_process').execSync;
-const existsSync = require('fs').existsSync;
-const path = require('path');
-
-const componentPaths = [];
-
-delete components.font;
-
-Object.keys(components).forEach(key => {
-  const filePath = path.join(__dirname, `../../packages/${key}/webpack.conf.js`);
-
-  if (existsSync(filePath)) {
-    componentPaths.push(`packages/${key}/webpack.conf.js`);
-  }
-});
-
-const paths = componentPaths.join(',');
-const cli = `node_modules/.bin/webpack build -c ${paths} -p`;
-
-execSync(cli, {
-  stdio: 'inherit'
-});

build/bin/build-components.js

@@ -0,0 +1,52 @@
+/**
+ * 编译 components 到 lib 目录
+ */
+const fs = require('fs-extra');
+const path = require('path');
+const compiler = require('vue-sfc-compiler');
+const libDir = path.resolve(__dirname, '../../lib');
+const srcDir = path.resolve(__dirname, '../../packages');
+require('shelljs/global');
+
+// 清空 lib 目录
+fs.emptyDirSync(libDir);
+
+// 复制 packages
+fs.copySync(srcDir, libDir);
+
+// 编译所有 .vue 文件到 .js
+compileVueFiles(libDir);
+
+// babel 编译
+exec('cross-env BABEL_ENV=commonjs babel lib --out-dir lib');
+
+function compileVueFiles(dir) {
+  const files = fs.readdirSync(dir);
+
+  files.forEach(file => {
+    const absolutePath = path.resolve(dir, file);
+
+    // 移除 vant-css
+    if (file.indexOf('vant-css') !== -1) {
+      fs.removeSync(absolutePath);
+    }
+    // 遍历文件夹
+    else if (isDir(absolutePath)) {
+      return compileVueFiles(absolutePath);
+    }
+    // 编译 .vue 文件
+    else if (/\.vue$/.test(file)) {
+      const source = fs.readFileSync(absolutePath, 'utf-8');
+      fs.removeSync(absolutePath);
+
+      const outputVuePath = absolutePath + '.js';
+      const outputJsPath = absolutePath.replace('.vue', '.js');
+      const output = fs.existsSync(outputJsPath) ? outputVuePath : outputJsPath;
+      fs.outputFileSync(output, compiler(source));
+    }
+  });
+}
+
+function isDir(dir) {
+  return fs.lstatSync(dir).isDirectory();
+}

build/bin/build-entry.js

@@ -4,8 +4,8 @@ var render = require('json-templater/string');
 var uppercamelcase = require('uppercamelcase');
 var path = require('path');
 
-var OUTPUT_PATH = path.join(__dirname, '../../src/index.js');
+var OUTPUT_PATH = path.join(__dirname, '../../packages/index.js');
-var IMPORT_TEMPLATE = 'import {{name}} from \'../packages/{{package}}/index.js\';';
+var IMPORT_TEMPLATE = 'import {{name}} from \'./{{package}}\';';
 var ISNTALL_COMPONENT_TEMPLATE = '  {{name}}';
 var MAIN_TEMPLATE = `{{include}}
 

build/bin/build-lib.js

@@ -3,11 +3,11 @@
  * Steps:
  * 1. 清理目录
  * 2. 构建 JS 入口文件
- * 3. 打包 JS 文件：vant.js && vant.min.js
+ * 3. 代码格式校验
- * 4. 构建 CSS 文件：vant-css
+ * 4. 构建每个组件对应的 [component].js
- * 5. 构建每个组件对应的 [component].js
+ * 5. 构建 vant-css
  * 6. 生成每个组件目录下的 style 入口
- * 7. 编译 utils
+ * 7. 打包 JS 文件：vant.js && vant.min.js
  */
 
 const fs = require('fs');
@@ -16,37 +16,27 @@ const components = require('../../components.json');
 const chalk = require('chalk');
 require('shelljs/global');
 
-// clean dir
+// 1. lint 
-log('Starting', 'clean');
-exec('npm run clean --silent');
-log('Finished', 'clean');
-
-// build entry
-log('Starting', 'build:entry');
-exec('npm run build:file --silent');
-log('Finished', 'build:entry');
-
-// lint 
 log('Starting', 'lint');
 exec('npm run lint --silent');
 log('Finished', 'lint');
 
-// build vant.js 
+// 2. build entry
-log('Starting', 'build:vant');
+log('Starting', 'build:entry');
-exec('npm run build:vant --silent');
+exec('npm run build:file --silent');
-log('Finished', 'build:vant');
+log('Finished', 'build:entry');
 
-// build [component].js
+// 3. build [component].js
 log('Starting', 'build:component');
 exec('npm run build:components --silent');
 log('Finished', 'build:component');
 
-// build vant-css
+// 4. build vant-css
 log('Starting', 'build:vant-css');
 exec('npm run build:vant-css --silent');
 log('Finished', 'build:vant-css');
 
-// build style entrys
+// 5. build style entrys
 log('Starting', 'build:style-entries');
 Object.keys(components).forEach((componentName) => {
   const dir = path.join(__dirname, '../../lib/', componentName, '/style');
@@ -61,10 +51,10 @@ Object.keys(components).forEach((componentName) => {
 });
 log('Finished', 'build:style-entries');
 
-// build utils 
+// 6. build vant.js 
-log('Starting', 'build:utils');
+log('Starting', 'build:vant');
-exec('npm run build:utils --silent');
+exec('npm run build:vant --silent');
-log('Finished', 'build:utils');
+log('Finished', 'build:vant');
 
 // helpers
 function log(status, action, breakLine) {

build/webpack.build.js

@@ -3,7 +3,7 @@ const config = require('./webpack.config.dev.js');
 const isMinify = process.argv.indexOf('-p') !== -1;
 
 config.entry = {
-  'vant': './src/index.js'
+  'vant': './packages/index.js'
 };
 
 config.output = {

build/webpack.components.js

@@ -1,31 +0,0 @@
-const path = require('path');
-const Components = require('../components.json');
-const config = require('./webpack.build.js');
-const webpack = require('webpack');
-
-delete config.devtool;
-
-const entry = {};
-Object.keys(Components).forEach(key => {
-  entry[key + '/index'] = Components[key];
-});
-
-config.entry = entry;
-
-config.externals = {
-  vue: {
-    root: 'Vue',
-    commonjs: 'vue',
-    commonjs2: 'vue',
-    amd: 'vue'
-  }
-};
-
-config.output = {
-  path: path.join(__dirname, '../lib'),
-  filename: '[name].js',
-  libraryExport: "default",
-  libraryTarget: 'umd'
-};
-
-module.exports = config;

build/webpack.config.dev.js

@@ -38,7 +38,6 @@ module.exports = {
     extensions: ['.js', '.vue', '.css'],
     alias: {
       vue: 'vue/dist/vue.runtime.esm.js',
-      src: path.join(__dirname, '../src'),
       packages: path.join(__dirname, '../packages'),
       lib: path.join(__dirname, '../lib'),
       components: path.join(__dirname, '../docs/src/components')
@@ -68,7 +67,7 @@ module.exports = {
       },
       {
         test: /\.js$/,
-        exclude: /node_modules|vue-router\/|vue-loader\/|vue-hot-reload-api\//,
+        exclude: /node_modules|vue-router\/|vue-loader\//,
         loader: 'babel-loader'
       },
       {

docs/examples-docs/actionsheet.md

@@ -53,7 +53,7 @@ export default {
 }
 </script>
 
-## ActionSheet 行动按钮
+## Actionsheet 行动按钮
 
 ### 代码演示
 
@@ -106,11 +106,11 @@ export default {
 ```
 :::
 
-#### 带取消按钮的ActionSheet
+#### 带取消按钮的 Actionsheet
 
-如果传入了`cancelText`属性，且不为空，则会在下方显示一个取消按钮，点击会将当前`ActionSheet`关闭。
+如果传入了`cancelText`属性，且不为空，则会在下方显示一个取消按钮，点击会将当前`Actionsheet`关闭。
 
-:::demo 带取消按钮的ActionSheet
+:::demo 带取消按钮的 Actionsheet
 ```html
 <van-button @click="show2 = true">弹出带取消按钮的actionsheet</van-button>
 <van-actionsheet v-model="show2" :actions="actions1" cancel-text="取消">
@@ -149,11 +149,11 @@ export default {
 ```
 :::
 
-#### 带标题的ActionSheet
+#### 带标题的 Actionsheet
 
-如果传入了`title`属性，且不为空，则另外一种样式的`ActionSheet`，里面内容需要自定义。
+如果传入了`title`属性，且不为空，则另外一种样式的`Actionsheet`，里面内容需要自定义。
 
-:::demo 带标题的ActionSheet
+:::demo 带标题的 Actionsheet
 ```html
 <van-button @click="show3 = true">弹出带标题的actionsheet</van-button>
 <van-actionsheet v-model="show3" title="支持以下配送方式" class="title-actionsheet">
@@ -170,10 +170,11 @@ export default {
 | title | 标题 | `String`  |  |    |
 | cancelText | 取消按钮文案 | `String`  |  |    |
 | overlay | 是否显示遮罩 | `Boolean`  |  |    |
-| closeOnClickOverlay | 点击遮罩是否关闭`ActionSheet` | `Boolean`  |  |    |
+| closeOnClickOverlay | 点击遮罩是否关闭`Actionsheet` | `Boolean`  |  |    |
 
 ### actions
 
+
 `API`中的`actions`为一个对象数组，数组中的每一个对象配置每一列，每一列有以下`key`：
 
 | key       | 说明      |

docs/examples-docs/changelog.md

@@ -90,7 +90,7 @@
 
 **非兼容更新和新特性:**
 
-- src/utils目录支持SSR [\#51](https://github.com/youzan/vant/pull/51) ([cookfront](https://github.com/cookfront))
+- packages/utils目录支持SSR [\#51](https://github.com/youzan/vant/pull/51) ([cookfront](https://github.com/cookfront))
 
 ## [v0.6.3](https://github.com/youzan/vant/tree/v0.6.3) (2017-07-04)
 [Full Changelog](https://github.com/youzan/vant/compare/v0.6.2...v0.6.3)

docs/examples-docs/dialog.md

@@ -7,7 +7,7 @@
 </style>
 
 <script>
-import { Dialog } from 'src/index';
+import { Dialog } from 'packages/index';
 
 export default {
   methods: {

docs/examples-docs/image-preview.md

@@ -7,7 +7,7 @@
 </style>
 
 <script>
-import { ImagePreview } from 'src/index';
+import { ImagePreview } from 'packages/index';
 
 export default {
   methods: {
@@ -41,7 +41,7 @@ import { ImagePreview } from 'vant';
 <van-button @click="handleImagePreview">预览图片</van-button>
 
 <script>
-import { ImagePreview } from 'src/index';
+import { ImagePreview } from 'packages/index';
 
 export default {
   methods: {

docs/examples-docs/toast.md

@@ -7,7 +7,7 @@
 </style>
 
 <script>
-import { Toast } from 'src/index';
+import { Toast } from 'packages/index';
 
 export default {
   methods: {
@@ -85,7 +85,7 @@ import { Toast } from 'vant';
 <van-button @click="showCustomizedToast(5000)">倒数5秒</van-button>
 
 <script>
-import { Toast } from 'src/index';
+import { Toast } from 'packages/index';
 
 export default {
   methods: {
@@ -137,7 +137,7 @@ export default {
 <van-button @click="closeToast">关闭</van-button>
 
 <script>
-import { Toast } from 'src/index';
+import { Toast } from 'packages/index';
 
 export default {
   methods: {
@@ -161,7 +161,7 @@ export default {
 <van-button @click="showHtmlToast">打开</van-button>
 
 <script>
-import { Toast } from 'src/index';
+import { Toast } from 'packages/index';
 
 export default {
   methods: {

docs/src/ExamplesApp.vue

@@ -54,37 +54,17 @@ export default {
 </script>
 
 <style>
-  html, body, div, span, applet, object, iframe,
-  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-  a, abbr, acronym, address, big, cite, code,
-  del, dfn, em, img, ins, kbd, q, s, samp,
-  small, strike, strong, sub, sup, tt, var,
-  b, u, i, center,
-  dl, dt, dd, ol, ul, li,
-  fieldset, form, label, legend,
-  table, caption, tbody, tfoot, thead, tr, th, td,
-  article, aside, canvas, details, embed, 
-  figure, figcaption, footer, header, hgroup, 
-  menu, nav, output, ruby, section, summary,
-  time, mark, audio, video {
-    margin: 0;
-    padding: 0;
-    border: 0;
-    font-size: 100%;
-    vertical-align: baseline;
-  }
-
   a {
     color: #4078c0;
     text-decoration: none;
   }
 
-  body, html {
+  body {
-    height: 100%;
+    -webkit-font-smoothing: antialiased;    
   }
 
-  body {
+  body, html {
-    font-family: 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;
+    height: 100%;
   }
 
   .examples-container {
@@ -95,38 +75,6 @@ export default {
     -webkit-overflow-scrolling: touch;
   }
 
-  .page-back {
-    display: inline-block;
-    position: absolute;
-    top: 12px;
-    left: 10px;
-    width: 40px;
-    height: 40px;
-    text-align: center;
-    color: #333;
-    transform: rotate(180deg);
-
-    i {
-      font-size: 24px;
-      line-height: 40px;
-    }
-  }
-
-  .demo-title {
-    font-size: 16px;
-    display: block;
-    line-height: 1;
-    padding: 20px 15px 0;
-  }
-
-  .demo-sub-title {
-    font-size: 14px;
-    font-weight: normal;
-    color: #999;
-    padding: 0 15px;
-    margin: 30px 0 10px;
-  }
-
   .footer {
     margin-top: 30px;
     width: 100%;

docs/src/examples.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 import VueRouter from 'vue-router';
 import App from './ExamplesApp';
 import routes from './router.config';
-import ZanUI from 'src/index';
+import ZanUI from 'packages/index';
 import ZanDoc from 'zan-doc';
 import 'packages/vant-css/src/index.css';
 

lerna.json

@@ -1,4 +0,0 @@
-{
-  "lerna": "2.0.0-beta.31",
-  "version": "independent"
-}

package.json

@@ -11,12 +11,11 @@
     "packages"
   ],
   "scripts": {
-    "bootstrap": "yarn || npm i",
+    "bootstrap": "yarn || npm i && cd ./packages/vant-css/ && yarn || npm i && cd ../../",
     "dev": "npm run build:file && webpack-dev-server --inline --config build/webpack.config.dev.js --content-base ./",
     "build:file": "node build/bin/build-entry.js",
-    "build:utils": "cross-env BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js --presets=es2015",
+    "build:components": "node build/bin/build-components.js --color",
-    "build:components": "cross-env NODE_ENV=production webpack --progress --hide-modules --config build/webpack.components.js --color",
+    "build:vant-css": "gulp build --gulpfile packages/vant-css/gulpfile.js --color && mkdir lib/vant-css && cp -R packages/vant-css/lib/ lib/vant-css",
-    "build:vant-css": "gulp build --gulpfile packages/vant-css/gulpfile.js --color && cp -R packages/vant-css/lib/ lib/vant-css",
     "build:vant": "cross-env NODE_ENV=production webpack --progress --hide-modules --color --config build/webpack.build.js && cross-env NODE_ENV=production webpack -p --progress --hide-modules --color --config build/webpack.build.js",
     "deploy": "npm run deploy:docs && npm run deploy:cdn && gh-pages -d docs/dist --remote youzan && rimraf docs/dist",
     "deploy:cdn": "superman cdn /zanui/vue docs/dist/*.js docs/dist/*.css",
@@ -41,7 +40,7 @@
   "author": "youzanfe",
   "license": "ISC",
   "dependencies": {
-    "raf.js": "0.0.4",
+    "babel-runtime": "6.x",
     "vue-lazyload": "^1.0.6"
   },
   "peerDependencies": {
@@ -55,11 +54,11 @@
     "babel-loader": "^7.1.1",
     "babel-plugin-module-resolver": "^2.7.1",
     "babel-plugin-syntax-jsx": "^6.18.0",
+    "babel-plugin-transform-object-rest-spread": "^6.23.0",
     "babel-plugin-transform-runtime": "^6.15.0",
     "babel-plugin-transform-vue-jsx": "^3.5.0",
     "babel-polyfill": "^6.23.0",
-    "babel-preset-es2015": "^6.16.0",
+    "babel-preset-env": "^1.6.0",
-    "babel-runtime": "^6.25.0",
     "chai": "^4.1.1",
     "cheerio": "^0.22.0",
     "codecov": "^2.2.0",
@@ -86,7 +85,6 @@
     "karma-sourcemap-loader": "^0.3.7",
     "karma-spec-reporter": "^0.0.31",
     "karma-webpack": "^2.0.4",
-    "lerna": "^2.0.0",
     "markdown-it": "^8.3.2",
     "markdown-it-container": "^2.0.0",
     "mocha": "^3.4.2",
@@ -104,15 +102,14 @@
     "uppercamelcase": "^3.0.0",
     "url-loader": "^0.5.9",
     "vue": "^2.4.2",
-    "vue-hot-reload-api": "^2.1.0",
     "vue-html-loader": "^1.2.4",
     "vue-loader": "^13.0.4",
     "vue-markdown-loader": "^2.0.0",
     "vue-router": "^2.7.0",
+    "vue-sfc-compiler": "^0.0.1",
     "vue-style-loader": "^3.0.0",
     "vue-template-compiler": "^2.4.2",
-    "vue-template-es2015-compiler": "^1.5.3",
+    "webpack": "^3.5.4",
-    "webpack": "^3.5.1",
     "webpack-dev-server": "^2.7.1",
     "webpack-merge": "^4.1.0",
     "zan-doc": "0.1.12"

packages/actionsheet/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/actionsheet/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "<%= name %>",
-  "version": "<%= version %>",
-  "description": "<%= description %>",
-  "main": "./lib/index.js",
-  "author": "<%= author %>",
-  "license": "<%= license %>",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/actionsheet/src/actionsheet.vue

@@ -1,6 +1,6 @@
 <template>
   <transition name="actionsheet-float">
-    <div class="van-actionsheet" :class="[ title ? 'van-actionsheet--withtitle' : '' ]" v-show="currentValue">
+    <div class="van-actionsheet" :class="{ 'van-actionsheet--withtitle': title }" v-show="currentValue">
       <div class="van-actionsheet__header" v-if="title">
         <h3 v-text="title"></h3>
         <van-icon name="close" @click.stop="currentValue = false"></van-icon>
@@ -17,9 +17,7 @@
               <span class="van-actionsheet__name">{{ item.name }}</span>
               <span class="van-actionsheet__subname" v-if="item.subname">{{ item.subname }}</span>
             </template>
-            <template v-else>
+            <van-loading v-else class="van-actionsheet__loading" type="circle" color="black" />
-              <van-loading class="van-actionsheet__loading" type="circle" color="black"></van-loading>
-            </template>
           </li>
         </ul>
         <a class="van-actionsheet__button" @click.stop="currentValue = false" v-if="cancelText">{{ cancelText }}</a>
@@ -34,9 +32,9 @@
 </template>
 
 <script>
-import Popup from 'src/mixins/popup';
+import Popup from '../../mixins/popup';
-import VanLoading from 'packages/loading';
+import VanLoading from '../../loading';
-import VanIcon from 'packages/icon';
+import VanIcon from '../../icon';
 
 export default {
   name: 'van-actionsheet',

packages/badge/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/badge/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "<%= name %>",
-  "version": "<%= version %>",
-  "description": "<%= description %>",
-  "main": "./lib/index.js",
-  "author": "<%= author %>",
-  "license": "<%= license %>",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/badge/src/badge.vue

@@ -1,13 +1,13 @@
 <template>
-    <a
+  <a
-      class="van-badge"
+    class="van-badge"
-      :class="{ 'van-badge--select': isSelect }"
+    :class="{ 'van-badge--select': isSelect }"
-      :href="url"
+    :href="url"
-      @click="handleClick">
+    @click="handleClick">
-      <div class="van-badge__active"></div>
+    <div class="van-badge__active"></div>
-      <div v-if="info" class="van-badge__info">{{info}}</div>
+    <div v-if="info" class="van-badge__info">{{info}}</div>
-      {{title}}
+    {{title}}
-    </a>
+  </a>
 </template>
 
 <script>

packages/button/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/button/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-button",
-  "version": "0.0.1",
-  "description": "button component",
-  "main": "./index.js",
-  "author": "niunai",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/button/src/button.js

@@ -11,7 +11,7 @@
  * <van-button size="large" type="primary">按钮</van-button>
  */
 
-import VanLoading from 'packages/loading';
+import VanLoading from '../../loading';
 
 const ALLOWED_SIZE = ['mini', 'small', 'normal', 'large'];
 const ALLOWED_TYPE = ['default', 'danger', 'primary'];

packages/card/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/card/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-card",
-  "version": "0.0.1",
-  "description": "card component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/cell-swipe/src/cell-swipe.vue

@@ -24,8 +24,8 @@
 </template>
 
 <script>
-  import {once} from 'src/utils/dom';
+  import {once} from '../../utils/dom';
-  import Clickoutside from 'src/utils/clickoutside';
+  import Clickoutside from '../../utils/clickoutside';
   
   export default {
     name: 'van-cell-swipe',
@@ -51,12 +51,10 @@
       this.wrap = this.$refs.cell.querySelector('.van-cell-wrapper');
       this.leftElm = this.$refs.left;
       this.leftWrapElm = this.leftElm.parentNode;
-      this.leftDefaultTransform = this.translate3d(-this.leftWidth - 1);
       this.leftWrapElm.style.webkitTransform = this.leftDefaultTransform;
 
       this.rightElm = this.$refs.right;
       this.rightWrapElm = this.rightElm.parentNode;
-      this.rightDefaultTransform = this.translate3d(this.rightWidth);
       this.rightWrapElm.style.webkitTransform = this.rightDefaultTransform;
     },
     methods: {
@@ -100,14 +98,12 @@
         }, 0);
       },
       startDrag(evt) {
-        console.log('startDrag')
         evt = evt.changedTouches ? evt.changedTouches[0] : evt;
         this.dragging = true;
         this.start.x = evt.pageX;
         this.start.y = evt.pageY;
       },
       onDrag(evt) {
-        console.log('onDrag')
         if (this.opened) {
           !this.swiping && this.swipeMove(0);
           this.opened = false;
@@ -132,7 +128,6 @@
         this.swipeMove(offsetLeft);
       },
       endDrag() {
-        console.log('endDrag')
         if (!this.swiping) return;
         this.swipeLeaveTransition(this.offsetLeft > 0 ? -1 : 1);
       }

packages/cell/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/cell/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-cell",
-  "version": "0.0.1",
-  "description": "cell component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/checkbox-group/index.js

@@ -1,3 +1,3 @@
-import CheckboxGroup from 'packages/checkbox/src/checkbox-group';
+import CheckboxGroup from '../checkbox/src/checkbox-group';
 
 export default CheckboxGroup;

packages/checkbox/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/checkbox/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-checkbox",
-  "version": "0.0.1",
-  "description": "checkbox component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/checkbox/src/checkbox.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-import findParent from 'src/mixins/findParent';
+import findParent from '../../mixins/findParent';
 
 export default {
   name: 'van-checkbox',

packages/col/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/col/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "<%= name %>",
-  "version": "<%= version %>",
-  "description": "<%= description %>",
-  "main": "./lib/index.js",
-  "author": "<%= author %>",
-  "license": "<%= license %>",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/datetime-picker/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/datetime-picker/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-datetime-picker",
-  "version": "0.0.1",
-  "description": "datetime picker component",
-  "main": "./index.js",
-  "author": "niunai <niunai@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/datetime-picker/src/datetime-picker.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script>
-import Picker from 'packages/picker';
+import Picker from '../../picker';
 
 const allowedType = ['time', 'date', 'datetime'];
 

packages/dialog/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/dialog/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-dialog",
-  "version": "0.0.1",
-  "description": "dialog component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/dialog/src/dialog.js

@@ -1,6 +1,5 @@
 import Vue from 'vue';
 import Dialog from './dialog.vue';
-import merge from 'src/utils/merge';
 
 const DialogConstructor = Vue.extend(Dialog);
 
@@ -24,6 +23,9 @@ const initInstance = () => {
     el: document.createElement('div')
   });
 
+  instance.$on('input', value => {
+    instance.value = value;
+  })
   instance.callback = defaultCallback;
 };
 
@@ -36,7 +38,7 @@ const showNextDialog = () => {
   if (!instance.value && dialogQueue.length > 0) {
     currentDialog = dialogQueue.shift();
 
-    const options = currentDialog.options;
+    const { options } = currentDialog;
 
     for (const prop in options) {
       /* istanbul ignore else */
@@ -45,22 +47,16 @@ const showNextDialog = () => {
       }
     }
 
-    if (options.callback === undefined) {
+    instance.callback = options.callback || defaultCallback;
-      instance.callback = defaultCallback;
+    instance.value = true;
-    }
-
     document.body.appendChild(instance.$el);
-
-    Vue.nextTick(() => {
-      instance.value = true;
-    });
   }
 };
 
 var DialogBox = options => {
   return new Promise((resolve, reject) => { // eslint-disable-line
     dialogQueue.push({
-      options: merge({}, options),
+      options: { ...options },
       callback: options.callback,
       resolve: resolve,
       reject: reject
@@ -71,23 +67,25 @@ var DialogBox = options => {
 };
 
 DialogBox.alert = function(options) {
-  return DialogBox(merge({
+  return DialogBox({
     type: 'alert',
     title: '',
     message: '',
     closeOnClickOverlay: false,
-    showCancelButton: false
+    showCancelButton: false,
-  }, options));
+    ...options
+  });
 };
 
 DialogBox.confirm = function(options) {
-  return DialogBox(merge({
+  return DialogBox({
     type: 'confirm',
     title: '',
     message: '',
     closeOnClickOverlay: true,
-    showCancelButton: true
+    showCancelButton: true,
-  }, options));
+    ...options
+  });
 };
 
 DialogBox.close = function() {

packages/dialog/src/dialog.vue

@@ -1,31 +1,29 @@
 <template>
-  <transition name="dialog-bounce">
+  <transition name="van-dialog-bounce">
-    <div class="van-dialog-wrapper">
+    <div class="van-dialog" v-show="value">
-      <div class="van-dialog" v-show="value">
+      <div class="van-dialog__header" v-if="title" v-text="title" />
-        <div class="van-dialog__header" v-if="title">
+      <div class="van-dialog__content" v-if="message">
-          <div class="van-dialog__title" v-text="title"></div>
+        <div class="van-dialog__message" :class="{ 'van-dialog__message--withtitle': title }" v-html="message" />
-        </div>
+      </div>
-        <div class="van-dialog__content" v-if="message">
+      <div class="van-dialog__footer" :class="{ 'is-twobtn': showCancelButton && showConfirmButton }">
-          <div class="van-dialog__message" :class="{ 'van-dialog__message--notitle': !title }" v-html="message"></div>
+        <van-button size="large" class="van-dialog__cancel" v-show="showCancelButton" @click="handleAction('cancel')">{{ cancelButtonText }}</van-button>
-        </div>
+        <van-button size="large" class="van-dialog__confirm" v-show="showConfirmButton" @click="handleAction('confirm')">{{ confirmButtonText }}</van-button>
-        <div class="van-dialog__footer" :class="{ 'is-twobtn': showCancelButton && showConfirmButton }">
-          <button class="van-dialog__btn van-dialog__cancel" v-show="showCancelButton" @click="handleAction('cancel')">{{ cancelButtonText }}</button>
-          <button class="van-dialog__btn van-dialog__confirm" v-show="showConfirmButton" @click="handleAction('confirm')">{{ confirmButtonText }}</button>
-        </div>
       </div>
     </div>
   </transition>
 </template>
 
 <script>
-import Popup from 'src/mixins/popup';
+import Button from '../../button';
-
+import Popup from '../../mixins/popup';
-const CANCEL_TEXT = '取消';
-const CONFIRM_TEXT = '确定';
 
 export default {
   name: 'van-dialog',
 
+  components: {
+    [Button.name]: Button
+  },
+
   mixins: [Popup],
 
   props: {
@@ -51,38 +49,16 @@ export default {
       type: '',
       showConfirmButton: true,
       showCancelButton: false,
-      confirmButtonText: CONFIRM_TEXT,
+      confirmButtonText: '确认',
-      cancelButtonText: CANCEL_TEXT,
+      cancelButtonText: '取消',
       callback: null
     };
   },
 
   methods: {
     handleAction(action) {
-      this.value = false;
+      this.$emit('input', false);
       this.callback && this.callback(action);
-    },
-
-    close() {
-      /* istanbul ignore if */
-      if (this.closing) return;
-
-      this.closing = true;
-
-      this.value = false;
-
-      /* istanbul ignore else */
-      if (this.lockOnScroll) {
-        setTimeout(() => {
-          if (this.overlay && this.bodyOverflow !== 'hidden') {
-            document.body.style.overflow = this.bodyOverflow;
-          }
-          this.bodyOverflow = null;
-        }, 200);
-      }
-
-      this.opened = false;
-      this.doAfterClose();
     }
   }
 };

packages/field/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/field/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-field",
-  "version": "0.0.1",
-  "description": "form field component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/field/src/field.vue

@@ -43,8 +43,8 @@
 
 <script>
 const VALID_TYPES = ['text', 'number', 'email', 'url', 'tel', 'date', 'time', 'datetime', 'password', 'textarea'];
-import vanCell from 'packages/cell';
+import vanCell from '../../cell';
-import vanIcon from 'packages/icon';
+import vanIcon from '../../icon';
 
 export default {
   name: 'van-field',

packages/icon/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/icon/package.json

@@ -1,9 +0,0 @@
-{
-  "name": "@youzan/van-icon",
-  "version": "0.0.1",
-  "description": "van-icon",
-  "main": "index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/image-preview/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/image-preview/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-image-pewview",
-  "version": "0.0.1",
-  "description": "image preview component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/image-preview/src/image-preview.vue

@@ -12,9 +12,9 @@
 
 <script>
 import Vue from 'vue';
-import Popup from 'src/mixins/popup';
+import Popup from '../../mixins/popup';
-import VanSwipe from 'packages/swipe';
+import VanSwipe from '../../swipe';
-import VanSwipeItem from 'packages/swipe-item';
+import VanSwipeItem from '../../swipe-item';
 
 export default {
   name: 'van-image-preview',

packages/index.js

@@ -0,0 +1,173 @@
+import Button from './button';
+import Switch from './switch';
+import Field from './field';
+import Radio from './radio';
+import Cell from './cell';
+import Icon from './icon';
+import CellGroup from './cell-group';
+import CellSwipe from './cell-swipe';
+import Popup from './popup';
+import Dialog from './dialog';
+import Picker from './picker';
+import RadioGroup from './radio-group';
+import Waterfall from './waterfall';
+import Loading from './loading';
+import Panel from './panel';
+import Card from './card';
+import Steps from './steps';
+import Tag from './tag';
+import Checkbox from './checkbox';
+import CheckboxGroup from './checkbox-group';
+import BadgeGroup from './badge-group';
+import Badge from './badge';
+import Search from './search';
+import Step from './step';
+import Tabs from './tabs';
+import Tab from './tab';
+import Lazyload from './lazyload';
+import ImagePreview from './image-preview';
+import Col from './col';
+import Row from './row';
+import Actionsheet from './actionsheet';
+import Quantity from './quantity';
+import Progress from './progress';
+import Toast from './toast';
+import Uploader from './uploader';
+import Swipe from './swipe';
+import SwipeItem from './swipe-item';
+import DatetimePicker from './datetime-picker';
+
+const version = '0.7.9';
+const components = [
+  Button,
+  Switch,
+  Field,
+  Radio,
+  Cell,
+  Icon,
+  CellGroup,
+  CellSwipe,
+  Popup,
+  Picker,
+  RadioGroup,
+  Loading,
+  Panel,
+  Card,
+  Steps,
+  Tag,
+  Checkbox,
+  CheckboxGroup,
+  BadgeGroup,
+  Badge,
+  Search,
+  Step,
+  Tabs,
+  Tab,
+  Col,
+  Row,
+  Actionsheet,
+  Quantity,
+  Progress,
+  Uploader,
+  Swipe,
+  SwipeItem,
+  DatetimePicker
+];
+
+const install = function(Vue) {
+  if (install.installed) return;
+
+  components.forEach(component => {
+    Vue.component(component.name, component);
+  });
+};
+
+/* istanbul ignore if */
+if (typeof window !== 'undefined' && window.Vue) {
+  install(window.Vue);
+}
+
+export {
+  install,
+  version,
+  Button,
+  Switch,
+  Field,
+  Radio,
+  Cell,
+  Icon,
+  CellGroup,
+  CellSwipe,
+  Popup,
+  Dialog,
+  Picker,
+  RadioGroup,
+  Waterfall,
+  Loading,
+  Panel,
+  Card,
+  Steps,
+  Tag,
+  Checkbox,
+  CheckboxGroup,
+  BadgeGroup,
+  Badge,
+  Search,
+  Step,
+  Tabs,
+  Tab,
+  Lazyload,
+  ImagePreview,
+  Col,
+  Row,
+  Actionsheet,
+  Quantity,
+  Progress,
+  Toast,
+  Uploader,
+  Swipe,
+  SwipeItem,
+  DatetimePicker
+};
+export default {
+  install,
+  version,
+  Button,
+  Switch,
+  Field,
+  Radio,
+  Cell,
+  Icon,
+  CellGroup,
+  CellSwipe,
+  Popup,
+  Dialog,
+  Picker,
+  RadioGroup,
+  Waterfall,
+  Loading,
+  Panel,
+  Card,
+  Steps,
+  Tag,
+  Checkbox,
+  CheckboxGroup,
+  BadgeGroup,
+  Badge,
+  Search,
+  Step,
+  Tabs,
+  Tab,
+  Lazyload,
+  ImagePreview,
+  Col,
+  Row,
+  Actionsheet,
+  Quantity,
+  Progress,
+  Toast,
+  Uploader,
+  Swipe,
+  SwipeItem,
+  DatetimePicker
+};

packages/lazyload/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/lazyload/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "<%= name %>",
-  "version": "<%= version %>",
-  "description": "<%= description %>",
-  "main": "./lib/index.js",
-  "author": "<%= author %>",
-  "license": "<%= license %>",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/loading/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/loading/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-loading",
-  "version": "0.0.1",
-  "description": "loading component",
-  "main": "./lib/index.js",
-  "author": "jiangruowei",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/mixins/popup/index.js

@@ -1,4 +1,4 @@
-import merge from 'src/utils/merge';
+import merge from '../../utils/merge';
 import PopupManager from './popup-manager';
 import PopupContext from './popup-context';
 

packages/mixins/popup/popup-context.js

@@ -1,4 +1,4 @@
-import merge from 'src/utils/merge';
+import merge from '../../utils/merge';
 import Vue from 'vue';
 
 let context;

packages/mixins/popup/popup-manager.js

@@ -1,5 +1,5 @@
 import Vue from 'vue';
-import { addClass } from 'src/utils/dom';
+import { addClass } from '../../utils/dom';
 import PopupContext from './popup-context';
 
 const getModal = function() {

packages/panel/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/panel/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-panel",
-  "version": "0.0.1",
-  "description": "panel component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/picker/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/picker/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-picker",
-  "version": "0.0.1",
-  "description": "picker component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/picker/src/picker-column.vue

@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import translateUtil from 'src/utils/transition';
+import translateUtil from '../../utils/transition';
 import draggable from './draggable';
 
 const DEFAULT_ITEM_HEIGHT = 44;

packages/popup/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/popup/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-popup",
-  "version": "0.0.1",
-  "description": "popup component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/popup/src/popup.vue

@@ -7,7 +7,7 @@
 </template>
 
 <script>
-import Popup from 'src/mixins/popup';
+import Popup from '../../mixins/popup';
 export default {
   name: 'van-popup',
 

packages/progress/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-progress",
-  "version": "0.0.1",
-  "description": "progress component",
-  "main": "./index.js",
-  "author": "jiangruowei",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/quantity/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/quantity/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "<%= name %>",
-  "version": "<%= version %>",
-  "description": "<%= description %>",
-  "main": "./lib/index.js",
-  "author": "<%= author %>",
-  "license": "<%= license %>",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/radio-group/index.js

@@ -1,3 +1,3 @@
-import RadioGroup from 'packages/radio/src/radio-group';
+import RadioGroup from '../radio/src/radio-group';
 
 export default RadioGroup;

packages/radio/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/radio/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@youzan/van-radio",
-  "version": "0.0.1",
-  "description": "radio component",
-  "main": "./index.js",
-  "author": "zhangmin <zhangmin@youzan.com>",
-  "license": "MIT",
-  "devDependencies": {},
-  "dependencies": {}
-}

packages/radio/src/radio.vue

@@ -25,7 +25,7 @@
 </template>
 
 <script>
-import findParent from 'src/mixins/findParent';
+import findParent from '../../mixins/findParent';
 
 export default {
   name: 'van-radio',

packages/row/CHANGELOG.md

@@ -1,8 +0,0 @@
-## 0.0.2 (2017-01-20)
-
-* 改了bug A
-* 加了功能B
-
-## 0.0.1 (2017-01-10)
-
-* 第一版

packages/row/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "<%= name %>",
-  "version": "<%= version %>",
-  "description": "<%= description %>",
-  "main": "./lib/index.js",
-  "author": "<%= author %>",
-  "license": "<%= license %>",
-  "devDependencies": {},
-  "dependencies": {}
-}