From 4de1e7da55d05a613df09ea0fadda200ef501bf2 Mon Sep 17 00:00:00 2001 From: neverland Date: Sat, 12 May 2018 15:22:37 +0800 Subject: [PATCH] [Improvement] Reorganize demos (#1052) --- .github/CONTRIBUTING.zh-CN.md | 6 +- .github/MARKDOWN.md | 3 +- build/bin/build-components.js | 2 +- build/bin/build-entry.js | 13 ++--- docs/demos/index.js | 58 ------------------- docs/markdown/en-US/area.md | 2 +- docs/markdown/en-US/{layout.md => col.md} | 0 .../en-US/{contact.md => contact-card.md} | 0 .../en-US/{coupon.md => coupon-list.md} | 0 .../en-US/{built-in-style.md => vant-css.md} | 0 docs/markdown/index.js | 16 ++--- docs/markdown/zh-CN/area.md | 2 +- docs/markdown/zh-CN/{layout.md => col.md} | 0 .../zh-CN/{contact.md => contact-card.md} | 0 .../zh-CN/{coupon.md => coupon-list.md} | 0 .../zh-CN/{built-in-style.md => vant-css.md} | 0 docs/{demos/common.js => src/demo-common.js} | 2 +- docs/src/demo-entry.js | 58 +++++++++++++++++++ docs/src/doc.config.js | 18 +++--- docs/src/router.js | 2 +- .../actionsheet/demo/index.vue | 2 +- .../address-edit/demo/index.vue | 2 +- .../address-list/demo/index.vue | 0 .../area/demo/area-en.js | 2 +- .../demos/mock => packages/area/demo}/area.js | 2 +- .../area.vue => packages/area/demo/index.vue | 4 +- .../badge/demo/index.vue | 0 .../button/demo/index.vue | 0 .../card.vue => packages/card/demo/index.vue | 0 .../cell-swipe/demo/index.vue | 0 .../cell.vue => packages/cell/demo/index.vue | 0 .../checkbox/demo/index.vue | 0 .../circle/demo/index.vue | 0 .../layout.vue => packages/col/demo/index.vue | 2 +- .../col/test/__snapshots__/index.spec.js.snap | 2 +- packages/col/test/index.spec.js | 3 +- .../collapse/demo/index.vue | 0 .../contact-card/demo/index.vue | 2 +- .../test/__snapshots__/index.spec.js.snap | 2 +- packages/contact-card/test/index.spec.js | 3 +- .../coupon-list/demo/index.vue | 2 +- .../test/__snapshots__/index.spec.js.snap | 2 +- .../test/index.spec.js | 2 +- .../datetime-picker/demo/index.vue | 0 .../dialog/demo/index.vue | 0 .../field/demo/index.vue | 0 .../goods-action/demo/index.vue | 0 .../icon.vue => packages/icon/demo/index.vue | 0 .../image-preview/demo/index.vue | 0 .../lazyload/demo/index.vue | 0 .../list.vue => packages/list/demo/index.vue | 0 .../loading/demo/index.vue | 0 .../nav-bar/demo/index.vue | 0 .../notice-bar/demo/index.vue | 0 .../number-keyboard/demo/index.vue | 0 .../pagination/demo/index.vue | 0 .../panel/demo/index.vue | 0 .../password-input/demo/index.vue | 0 .../picker/demo/index.vue | 0 .../popup/demo/index.vue | 0 .../progress/demo/index.vue | 0 .../pull-refresh/demo/index.vue | 0 .../radio/demo/index.vue | 0 .../rate.vue => packages/rate/demo/index.vue | 0 .../search/demo/index.vue | 0 .../mock/sku.js => packages/sku/demo/data.js | 0 .../sku.vue => packages/sku/demo/index.vue | 2 +- .../slider/demo/index.vue | 0 .../stepper/demo/index.vue | 0 .../steps/demo/index.vue | 0 .../submit-bar/demo/index.vue | 0 .../swipe/demo/index.vue | 0 .../switch-cell/demo/index.vue | 0 .../switch/demo/index.vue | 0 .../tab.vue => packages/tab/demo/index.vue | 0 .../tabbar/demo/index.vue | 0 .../tag.vue => packages/tag/demo/index.vue | 0 .../toast/demo/index.vue | 0 .../tree-select/demo/index.vue | 0 .../uploader/demo/index.vue | 0 .../vant-css/demo/index.vue | 2 +- .../waterfall/demo/index.vue | 0 test/demo-test.js | 4 +- 83 files changed, 109 insertions(+), 113 deletions(-) delete mode 100644 docs/demos/index.js rename docs/markdown/en-US/{layout.md => col.md} (100%) rename docs/markdown/en-US/{contact.md => contact-card.md} (100%) rename docs/markdown/en-US/{coupon.md => coupon-list.md} (100%) rename docs/markdown/en-US/{built-in-style.md => vant-css.md} (100%) rename docs/markdown/zh-CN/{layout.md => col.md} (100%) rename docs/markdown/zh-CN/{contact.md => contact-card.md} (100%) rename docs/markdown/zh-CN/{coupon.md => coupon-list.md} (100%) rename docs/markdown/zh-CN/{built-in-style.md => vant-css.md} (100%) rename docs/{demos/common.js => src/demo-common.js} (100%) create mode 100644 docs/src/demo-entry.js rename docs/demos/views/actionsheet.vue => packages/actionsheet/demo/index.vue (99%) rename docs/demos/views/address-edit.vue => packages/address-edit/demo/index.vue (96%) rename docs/demos/views/address-list.vue => packages/address-list/demo/index.vue (100%) rename docs/demos/mock/areaEn.js => packages/area/demo/area-en.js (99%) rename {docs/demos/mock => packages/area/demo}/area.js (99%) rename docs/demos/views/area.vue => packages/area/demo/index.vue (90%) rename docs/demos/views/badge.vue => packages/badge/demo/index.vue (100%) rename docs/demos/views/button.vue => packages/button/demo/index.vue (100%) rename docs/demos/views/card.vue => packages/card/demo/index.vue (100%) rename docs/demos/views/cell-swipe.vue => packages/cell-swipe/demo/index.vue (100%) rename docs/demos/views/cell.vue => packages/cell/demo/index.vue (100%) rename docs/demos/views/checkbox.vue => packages/checkbox/demo/index.vue (100%) rename docs/demos/views/circle.vue => packages/circle/demo/index.vue (100%) rename docs/demos/views/layout.vue => packages/col/demo/index.vue (98%) rename docs/demos/views/collapse.vue => packages/collapse/demo/index.vue (100%) rename docs/demos/views/contact.vue => packages/contact-card/demo/index.vue (99%) rename docs/demos/views/coupon.vue => packages/coupon-list/demo/index.vue (99%) rename packages/{coupon-cell => coupon-list}/test/__snapshots__/index.spec.js.snap (99%) rename packages/{coupon-cell => coupon-list}/test/index.spec.js (97%) rename docs/demos/views/datetime-picker.vue => packages/datetime-picker/demo/index.vue (100%) rename docs/demos/views/dialog.vue => packages/dialog/demo/index.vue (100%) rename docs/demos/views/field.vue => packages/field/demo/index.vue (100%) rename docs/demos/views/goods-action.vue => packages/goods-action/demo/index.vue (100%) rename docs/demos/views/icon.vue => packages/icon/demo/index.vue (100%) rename docs/demos/views/image-preview.vue => packages/image-preview/demo/index.vue (100%) rename docs/demos/views/lazyload.vue => packages/lazyload/demo/index.vue (100%) rename docs/demos/views/list.vue => packages/list/demo/index.vue (100%) rename docs/demos/views/loading.vue => packages/loading/demo/index.vue (100%) rename docs/demos/views/nav-bar.vue => packages/nav-bar/demo/index.vue (100%) rename docs/demos/views/notice-bar.vue => packages/notice-bar/demo/index.vue (100%) rename docs/demos/views/number-keyboard.vue => packages/number-keyboard/demo/index.vue (100%) rename docs/demos/views/pagination.vue => packages/pagination/demo/index.vue (100%) rename docs/demos/views/panel.vue => packages/panel/demo/index.vue (100%) rename docs/demos/views/password-input.vue => packages/password-input/demo/index.vue (100%) rename docs/demos/views/picker.vue => packages/picker/demo/index.vue (100%) rename docs/demos/views/popup.vue => packages/popup/demo/index.vue (100%) rename docs/demos/views/progress.vue => packages/progress/demo/index.vue (100%) rename docs/demos/views/pull-refresh.vue => packages/pull-refresh/demo/index.vue (100%) rename docs/demos/views/radio.vue => packages/radio/demo/index.vue (100%) rename docs/demos/views/rate.vue => packages/rate/demo/index.vue (100%) rename docs/demos/views/search.vue => packages/search/demo/index.vue (100%) rename docs/demos/mock/sku.js => packages/sku/demo/data.js (100%) rename docs/demos/views/sku.vue => packages/sku/demo/index.vue (99%) rename docs/demos/views/slider.vue => packages/slider/demo/index.vue (100%) rename docs/demos/views/stepper.vue => packages/stepper/demo/index.vue (100%) rename docs/demos/views/steps.vue => packages/steps/demo/index.vue (100%) rename docs/demos/views/submit-bar.vue => packages/submit-bar/demo/index.vue (100%) rename docs/demos/views/swipe.vue => packages/swipe/demo/index.vue (100%) rename docs/demos/views/switch-cell.vue => packages/switch-cell/demo/index.vue (100%) rename docs/demos/views/switch.vue => packages/switch/demo/index.vue (100%) rename docs/demos/views/tab.vue => packages/tab/demo/index.vue (100%) rename docs/demos/views/tabbar.vue => packages/tabbar/demo/index.vue (100%) rename docs/demos/views/tag.vue => packages/tag/demo/index.vue (100%) rename docs/demos/views/toast.vue => packages/toast/demo/index.vue (100%) rename docs/demos/views/tree-select.vue => packages/tree-select/demo/index.vue (100%) rename docs/demos/views/uploader.vue => packages/uploader/demo/index.vue (100%) rename docs/demos/views/built-in-style.vue => packages/vant-css/demo/index.vue (98%) rename docs/demos/views/waterfall.vue => packages/waterfall/demo/index.vue (100%) diff --git a/.github/CONTRIBUTING.zh-CN.md b/.github/CONTRIBUTING.zh-CN.md index a01e1b8d5..b74406816 100644 --- a/.github/CONTRIBUTING.zh-CN.md +++ b/.github/CONTRIBUTING.zh-CN.md @@ -48,7 +48,7 @@ vant - 添加 Vue 代码 -以添加新组件 `Button` 为例，首先在 `packages` 目录下新建目录 `button`，用 `index.js` 或者 `index.vue` 文件做为组件入口，需要的话可以建其他文件来组织代码。 +以添加新组件 `Button` 为例，首先在 `packages` 目录下新建目录 `button`，用 `index.js` 或者 `index.vue` 文件做为组件入口，需要的话可以建其他文件来组织代码。测试代码放在组件目录下的 `test` 文件夹中，示例代码放在组件目录下的 `demo` 文件夹中。 - 添加样式代码 @@ -60,10 +60,6 @@ vant 新组件的文档编写，需要在 `docs/markdown` 下各个语言中新建对应同名文档 `button.md`，在 `docs/demos` 下创建组件示例，并在 `docs/src/doc.config.js` 中进行配置组件名称 -- 添加测试代码 - -需要在 `test/specs` 目录下增加对应组件的测试文件，以 .spec.js 结尾，如：`button.spec.js`。测试框架使用了 karma + mocha + sinon + chai，vue 相关的操作使用了 [avoriaz](https://github.com/eddyerburgh/avoriaz) - ## 组件文档如何编写 diff --git a/.github/MARKDOWN.md b/.github/MARKDOWN.md index ade817155..d00d198d5 100644 --- a/.github/MARKDOWN.md +++ b/.github/MARKDOWN.md @@ -2,7 +2,7 @@ #### 文件格式 -组件文档采用 markdown 格式，和普通 markdown 最大的区别是示例代码是直接写在 markdown 文件里面，所以请确保你写的示例代码是可以正确运行的。 +组件文档采用 markdown 格式编写 #### 文档内的标题规范 @@ -40,4 +40,3 @@ - 从简单用法开始介绍，不要上来就同时使用一大堆 API，会让人觉得难以上手 - 正交性原则，一个示例只演示一个（或者一类）API 的使用方法，如无特殊需求不要在一个示例中同时演示多个 API 混合使用 -- 如果示例的一句话描述无法完整描述整个场景，可以在 `:::demo` 之前写一段详细的说明性文字 diff --git a/build/bin/build-components.js b/build/bin/build-components.js index d79b28c6b..7725edcc2 100644 --- a/build/bin/build-components.js +++ b/build/bin/build-components.js @@ -13,7 +13,7 @@ const compilerOption = { extends: path.join(__dirname, '../../.babelrc') } }; -const whiteList = ['vant-css', 'test']; +const whiteList = ['vant-css', 'test', 'demo']; // clear dir fs.emptyDirSync(esDir); diff --git a/build/bin/build-entry.js b/build/bin/build-entry.js index e6ca9e141..25f64a9fb 100644 --- a/build/bin/build-entry.js +++ b/build/bin/build-entry.js @@ -1,5 +1,5 @@ const Components = require('./get-components')(); -const fs = require('fs'); +const fs = require('fs-extra'); const path = require('path'); const uppercamelize = require('uppercamelcase'); const version = process.env.VERSION || require('../../package.json').version; @@ -49,20 +49,19 @@ export default { } function buildDemoEntry() { - const dir = path.join(__dirname, '../../docs/demos/views'); + const dir = path.join(__dirname, '../../packages'); const demos = fs.readdirSync(dir) - .filter(name => ~name.indexOf('.vue')) - .map(name => name.replace('.vue', '')) - .map(name => `'${name}': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/${name}'), '${name}')), '${name}'))`); + .filter(name => fs.existsSync(path.join(dir, `${name}/demo/index.vue`))) + .map(name => `'${name}': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/${name}/demo'), '${name}')), '${name}'))`); const content = `${tips} -import { asyncWrapper, componentWrapper } from './common'; +import { asyncWrapper, componentWrapper } from './demo-common'; export default { ${demos.join(',\n ')} }; `; - fs.writeFileSync(path.join(dir, '../index.js'), content); + fs.writeFileSync(path.join(dir, '../docs/src/demo-entry.js'), content); } function buildDocsEntry() { diff --git a/docs/demos/index.js b/docs/demos/index.js deleted file mode 100644 index 98bcc7e6d..000000000 --- a/docs/demos/index.js +++ /dev/null @@ -1,58 +0,0 @@ -// This file is auto gererated by build/bin/build-entry.js -import { asyncWrapper, componentWrapper } from './common'; - -export default { - 'actionsheet': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/actionsheet'), 'actionsheet')), 'actionsheet')), - 'address-edit': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/address-edit'), 'address-edit')), 'address-edit')), - 'address-list': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/address-list'), 'address-list')), 'address-list')), - 'area': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/area'), 'area')), 'area')), - 'badge': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/badge'), 'badge')), 'badge')), - 'built-in-style': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/built-in-style'), 'built-in-style')), 'built-in-style')), - 'button': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/button'), 'button')), 'button')), - 'card': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/card'), 'card')), 'card')), - 'cell-swipe': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/cell-swipe'), 'cell-swipe')), 'cell-swipe')), - 'cell': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/cell'), 'cell')), 'cell')), - 'checkbox': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/checkbox'), 'checkbox')), 'checkbox')), - 'circle': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/circle'), 'circle')), 'circle')), - 'collapse': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/collapse'), 'collapse')), 'collapse')), - 'contact': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/contact'), 'contact')), 'contact')), - 'coupon': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/coupon'), 'coupon')), 'coupon')), - 'datetime-picker': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/datetime-picker'), 'datetime-picker')), 'datetime-picker')), - 'dialog': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/dialog'), 'dialog')), 'dialog')), - 'field': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/field'), 'field')), 'field')), - 'goods-action': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/goods-action'), 'goods-action')), 'goods-action')), - 'icon': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/icon'), 'icon')), 'icon')), - 'image-preview': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/image-preview'), 'image-preview')), 'image-preview')), - 'layout': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/layout'), 'layout')), 'layout')), - 'lazyload': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/lazyload'), 'lazyload')), 'lazyload')), - 'list': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/list'), 'list')), 'list')), - 'loading': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/loading'), 'loading')), 'loading')), - 'nav-bar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/nav-bar'), 'nav-bar')), 'nav-bar')), - 'notice-bar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/notice-bar'), 'notice-bar')), 'notice-bar')), - 'number-keyboard': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/number-keyboard'), 'number-keyboard')), 'number-keyboard')), - 'pagination': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/pagination'), 'pagination')), 'pagination')), - 'panel': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/panel'), 'panel')), 'panel')), - 'password-input': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/password-input'), 'password-input')), 'password-input')), - 'picker': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/picker'), 'picker')), 'picker')), - 'popup': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/popup'), 'popup')), 'popup')), - 'progress': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/progress'), 'progress')), 'progress')), - 'pull-refresh': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/pull-refresh'), 'pull-refresh')), 'pull-refresh')), - 'radio': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/radio'), 'radio')), 'radio')), - 'rate': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/rate'), 'rate')), 'rate')), - 'search': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/search'), 'search')), 'search')), - 'sku': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/sku'), 'sku')), 'sku')), - 'slider': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/slider'), 'slider')), 'slider')), - 'stepper': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/stepper'), 'stepper')), 'stepper')), - 'steps': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/steps'), 'steps')), 'steps')), - 'submit-bar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/submit-bar'), 'submit-bar')), 'submit-bar')), - 'swipe': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/swipe'), 'swipe')), 'swipe')), - 'switch-cell': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/switch-cell'), 'switch-cell')), 'switch-cell')), - 'switch': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/switch'), 'switch')), 'switch')), - 'tab': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/tab'), 'tab')), 'tab')), - 'tabbar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/tabbar'), 'tabbar')), 'tabbar')), - 'tag': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/tag'), 'tag')), 'tag')), - 'toast': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/toast'), 'toast')), 'toast')), - 'tree-select': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/tree-select'), 'tree-select')), 'tree-select')), - 'uploader': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/uploader'), 'uploader')), 'uploader')), - 'waterfall': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/waterfall'), 'waterfall')), 'waterfall')) -}; diff --git a/docs/markdown/en-US/area.md b/docs/markdown/en-US/area.md index e6bf68523..d29a8c622 100644 --- a/docs/markdown/en-US/area.md +++ b/docs/markdown/en-US/area.md @@ -88,7 +88,7 @@ Example of `AreaList` } ``` -All code of China: [Area.json](https://github.com/youzan/vant/blob/dev/docs/demos/mock/area.js) +All code of China: [Area.json](https://github.com/youzan/vant/blob/dev/packages/area/demo/area-en.js) #### argument of callback function confirm An array contains selected area objects. diff --git a/docs/markdown/en-US/layout.md b/docs/markdown/en-US/col.md similarity index 100% rename from docs/markdown/en-US/layout.md rename to docs/markdown/en-US/col.md diff --git a/docs/markdown/en-US/contact.md b/docs/markdown/en-US/contact-card.md similarity index 100% rename from docs/markdown/en-US/contact.md rename to docs/markdown/en-US/contact-card.md diff --git a/docs/markdown/en-US/coupon.md b/docs/markdown/en-US/coupon-list.md similarity index 100% rename from docs/markdown/en-US/coupon.md rename to docs/markdown/en-US/coupon-list.md diff --git a/docs/markdown/en-US/built-in-style.md b/docs/markdown/en-US/vant-css.md similarity index 100% rename from docs/markdown/en-US/built-in-style.md rename to docs/markdown/en-US/vant-css.md diff --git a/docs/markdown/index.js b/docs/markdown/index.js index c603df934..e307d687e 100644 --- a/docs/markdown/index.js +++ b/docs/markdown/index.js @@ -18,7 +18,6 @@ export default { 'zh-CN/address-list': wrapper(r => require.ensure([], () => r(require('./zh-CN/address-list.md')), 'zh-CN/address-list')), 'zh-CN/area': wrapper(r => require.ensure([], () => r(require('./zh-CN/area.md')), 'zh-CN/area')), 'zh-CN/badge': wrapper(r => require.ensure([], () => r(require('./zh-CN/badge.md')), 'zh-CN/badge')), - 'zh-CN/built-in-style': wrapper(r => require.ensure([], () => r(require('./zh-CN/built-in-style.md')), 'zh-CN/built-in-style')), 'zh-CN/button': wrapper(r => require.ensure([], () => r(require('./zh-CN/button.md')), 'zh-CN/button')), 'zh-CN/card': wrapper(r => require.ensure([], () => r(require('./zh-CN/card.md')), 'zh-CN/card')), 'zh-CN/cell-swipe': wrapper(r => require.ensure([], () => r(require('./zh-CN/cell-swipe.md')), 'zh-CN/cell-swipe')), @@ -27,9 +26,10 @@ export default { 'zh-CN/changelog': wrapper(r => require.ensure([], () => r(require('./zh-CN/changelog.md')), 'zh-CN/changelog')), 'zh-CN/checkbox': wrapper(r => require.ensure([], () => r(require('./zh-CN/checkbox.md')), 'zh-CN/checkbox')), 'zh-CN/circle': wrapper(r => require.ensure([], () => r(require('./zh-CN/circle.md')), 'zh-CN/circle')), + 'zh-CN/col': wrapper(r => require.ensure([], () => r(require('./zh-CN/col.md')), 'zh-CN/col')), 'zh-CN/collapse': wrapper(r => require.ensure([], () => r(require('./zh-CN/collapse.md')), 'zh-CN/collapse')), - 'zh-CN/contact': wrapper(r => require.ensure([], () => r(require('./zh-CN/contact.md')), 'zh-CN/contact')), - 'zh-CN/coupon': wrapper(r => require.ensure([], () => r(require('./zh-CN/coupon.md')), 'zh-CN/coupon')), + 'zh-CN/contact-card': wrapper(r => require.ensure([], () => r(require('./zh-CN/contact-card.md')), 'zh-CN/contact-card')), + 'zh-CN/coupon-list': wrapper(r => require.ensure([], () => r(require('./zh-CN/coupon-list.md')), 'zh-CN/coupon-list')), 'zh-CN/datetime-picker': wrapper(r => require.ensure([], () => r(require('./zh-CN/datetime-picker.md')), 'zh-CN/datetime-picker')), 'zh-CN/dialog': wrapper(r => require.ensure([], () => r(require('./zh-CN/dialog.md')), 'zh-CN/dialog')), 'zh-CN/field': wrapper(r => require.ensure([], () => r(require('./zh-CN/field.md')), 'zh-CN/field')), @@ -38,7 +38,6 @@ export default { 'zh-CN/icon': wrapper(r => require.ensure([], () => r(require('./zh-CN/icon.md')), 'zh-CN/icon')), 'zh-CN/image-preview': wrapper(r => require.ensure([], () => r(require('./zh-CN/image-preview.md')), 'zh-CN/image-preview')), 'zh-CN/intro': wrapper(r => require.ensure([], () => r(require('./zh-CN/intro.md')), 'zh-CN/intro')), - 'zh-CN/layout': wrapper(r => require.ensure([], () => r(require('./zh-CN/layout.md')), 'zh-CN/layout')), 'zh-CN/lazyload': wrapper(r => require.ensure([], () => r(require('./zh-CN/lazyload.md')), 'zh-CN/lazyload')), 'zh-CN/list': wrapper(r => require.ensure([], () => r(require('./zh-CN/list.md')), 'zh-CN/list')), 'zh-CN/loading': wrapper(r => require.ensure([], () => r(require('./zh-CN/loading.md')), 'zh-CN/loading')), @@ -71,13 +70,13 @@ export default { 'zh-CN/toast': wrapper(r => require.ensure([], () => r(require('./zh-CN/toast.md')), 'zh-CN/toast')), 'zh-CN/tree-select': wrapper(r => require.ensure([], () => r(require('./zh-CN/tree-select.md')), 'zh-CN/tree-select')), 'zh-CN/uploader': wrapper(r => require.ensure([], () => r(require('./zh-CN/uploader.md')), 'zh-CN/uploader')), + 'zh-CN/vant-css': wrapper(r => require.ensure([], () => r(require('./zh-CN/vant-css.md')), 'zh-CN/vant-css')), 'zh-CN/waterfall': wrapper(r => require.ensure([], () => r(require('./zh-CN/waterfall.md')), 'zh-CN/waterfall')), 'en-US/actionsheet': wrapper(r => require.ensure([], () => r(require('./en-US/actionsheet.md')), 'en-US/actionsheet')), 'en-US/address-edit': wrapper(r => require.ensure([], () => r(require('./en-US/address-edit.md')), 'en-US/address-edit')), 'en-US/address-list': wrapper(r => require.ensure([], () => r(require('./en-US/address-list.md')), 'en-US/address-list')), 'en-US/area': wrapper(r => require.ensure([], () => r(require('./en-US/area.md')), 'en-US/area')), 'en-US/badge': wrapper(r => require.ensure([], () => r(require('./en-US/badge.md')), 'en-US/badge')), - 'en-US/built-in-style': wrapper(r => require.ensure([], () => r(require('./en-US/built-in-style.md')), 'en-US/built-in-style')), 'en-US/button': wrapper(r => require.ensure([], () => r(require('./en-US/button.md')), 'en-US/button')), 'en-US/card': wrapper(r => require.ensure([], () => r(require('./en-US/card.md')), 'en-US/card')), 'en-US/cell-swipe': wrapper(r => require.ensure([], () => r(require('./en-US/cell-swipe.md')), 'en-US/cell-swipe')), @@ -85,9 +84,10 @@ export default { 'en-US/changelog': wrapper(r => require.ensure([], () => r(require('./en-US/changelog.md')), 'en-US/changelog')), 'en-US/checkbox': wrapper(r => require.ensure([], () => r(require('./en-US/checkbox.md')), 'en-US/checkbox')), 'en-US/circle': wrapper(r => require.ensure([], () => r(require('./en-US/circle.md')), 'en-US/circle')), + 'en-US/col': wrapper(r => require.ensure([], () => r(require('./en-US/col.md')), 'en-US/col')), 'en-US/collapse': wrapper(r => require.ensure([], () => r(require('./en-US/collapse.md')), 'en-US/collapse')), - 'en-US/contact': wrapper(r => require.ensure([], () => r(require('./en-US/contact.md')), 'en-US/contact')), - 'en-US/coupon': wrapper(r => require.ensure([], () => r(require('./en-US/coupon.md')), 'en-US/coupon')), + 'en-US/contact-card': wrapper(r => require.ensure([], () => r(require('./en-US/contact-card.md')), 'en-US/contact-card')), + 'en-US/coupon-list': wrapper(r => require.ensure([], () => r(require('./en-US/coupon-list.md')), 'en-US/coupon-list')), 'en-US/datetime-picker': wrapper(r => require.ensure([], () => r(require('./en-US/datetime-picker.md')), 'en-US/datetime-picker')), 'en-US/dialog': wrapper(r => require.ensure([], () => r(require('./en-US/dialog.md')), 'en-US/dialog')), 'en-US/field': wrapper(r => require.ensure([], () => r(require('./en-US/field.md')), 'en-US/field')), @@ -96,7 +96,6 @@ export default { 'en-US/icon': wrapper(r => require.ensure([], () => r(require('./en-US/icon.md')), 'en-US/icon')), 'en-US/image-preview': wrapper(r => require.ensure([], () => r(require('./en-US/image-preview.md')), 'en-US/image-preview')), 'en-US/intro': wrapper(r => require.ensure([], () => r(require('./en-US/intro.md')), 'en-US/intro')), - 'en-US/layout': wrapper(r => require.ensure([], () => r(require('./en-US/layout.md')), 'en-US/layout')), 'en-US/lazyload': wrapper(r => require.ensure([], () => r(require('./en-US/lazyload.md')), 'en-US/lazyload')), 'en-US/list': wrapper(r => require.ensure([], () => r(require('./en-US/list.md')), 'en-US/list')), 'en-US/loading': wrapper(r => require.ensure([], () => r(require('./en-US/loading.md')), 'en-US/loading')), @@ -129,5 +128,6 @@ export default { 'en-US/toast': wrapper(r => require.ensure([], () => r(require('./en-US/toast.md')), 'en-US/toast')), 'en-US/tree-select': wrapper(r => require.ensure([], () => r(require('./en-US/tree-select.md')), 'en-US/tree-select')), 'en-US/uploader': wrapper(r => require.ensure([], () => r(require('./en-US/uploader.md')), 'en-US/uploader')), + 'en-US/vant-css': wrapper(r => require.ensure([], () => r(require('./en-US/vant-css.md')), 'en-US/vant-css')), 'en-US/waterfall': wrapper(r => require.ensure([], () => r(require('./en-US/waterfall.md')), 'en-US/waterfall')) }; diff --git a/docs/markdown/zh-CN/area.md b/docs/markdown/zh-CN/area.md index 5dc0d33d8..351217398 100644 --- a/docs/markdown/zh-CN/area.md +++ b/docs/markdown/zh-CN/area.md @@ -92,7 +92,7 @@ Vue.use(Area); } ``` -完整数据见 [Area.json](https://github.com/youzan/vant/blob/dev/docs/demos/mock/area.js) +完整数据见 [Area.json](https://github.com/youzan/vant/blob/dev/packages/area/demo/area.js) #### 点击完成时返回的数据格式 diff --git a/docs/markdown/zh-CN/layout.md b/docs/markdown/zh-CN/col.md similarity index 100% rename from docs/markdown/zh-CN/layout.md rename to docs/markdown/zh-CN/col.md diff --git a/docs/markdown/zh-CN/contact.md b/docs/markdown/zh-CN/contact-card.md similarity index 100% rename from docs/markdown/zh-CN/contact.md rename to docs/markdown/zh-CN/contact-card.md diff --git a/docs/markdown/zh-CN/coupon.md b/docs/markdown/zh-CN/coupon-list.md similarity index 100% rename from docs/markdown/zh-CN/coupon.md rename to docs/markdown/zh-CN/coupon-list.md diff --git a/docs/markdown/zh-CN/built-in-style.md b/docs/markdown/zh-CN/vant-css.md similarity index 100% rename from docs/markdown/zh-CN/built-in-style.md rename to docs/markdown/zh-CN/vant-css.md diff --git a/docs/demos/common.js b/docs/src/demo-common.js similarity index 100% rename from docs/demos/common.js rename to docs/src/demo-common.js index 27f775f3c..900655b8e 100644 --- a/docs/demos/common.js +++ b/docs/src/demo-common.js @@ -19,12 +19,12 @@ Vue lazyComponent: true }); +Vue.mixin(i18n); Vue.component('demo-block', DemoBlock); Vue.component('demo-section', DemoSection); window.Toast = Toast; window.Dialog = Dialog; -Vue.mixin(i18n); Locale.add({ 'zh-CN': { diff --git a/docs/src/demo-entry.js b/docs/src/demo-entry.js new file mode 100644 index 000000000..12f456c98 --- /dev/null +++ b/docs/src/demo-entry.js @@ -0,0 +1,58 @@ +// This file is auto gererated by build/bin/build-entry.js +import { asyncWrapper, componentWrapper } from './demo-common'; + +export default { + 'actionsheet': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/actionsheet/demo'), 'actionsheet')), 'actionsheet')), + 'address-edit': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/address-edit/demo'), 'address-edit')), 'address-edit')), + 'address-list': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/address-list/demo'), 'address-list')), 'address-list')), + 'area': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/area/demo'), 'area')), 'area')), + 'badge': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/badge/demo'), 'badge')), 'badge')), + 'button': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/button/demo'), 'button')), 'button')), + 'card': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/card/demo'), 'card')), 'card')), + 'cell': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/cell/demo'), 'cell')), 'cell')), + 'cell-swipe': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/cell-swipe/demo'), 'cell-swipe')), 'cell-swipe')), + 'checkbox': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/checkbox/demo'), 'checkbox')), 'checkbox')), + 'circle': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/circle/demo'), 'circle')), 'circle')), + 'col': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/col/demo'), 'col')), 'col')), + 'collapse': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/collapse/demo'), 'collapse')), 'collapse')), + 'contact-card': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/contact-card/demo'), 'contact-card')), 'contact-card')), + 'coupon-list': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/coupon-list/demo'), 'coupon-list')), 'coupon-list')), + 'datetime-picker': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/datetime-picker/demo'), 'datetime-picker')), 'datetime-picker')), + 'dialog': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/dialog/demo'), 'dialog')), 'dialog')), + 'field': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/field/demo'), 'field')), 'field')), + 'goods-action': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/goods-action/demo'), 'goods-action')), 'goods-action')), + 'icon': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/icon/demo'), 'icon')), 'icon')), + 'image-preview': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/image-preview/demo'), 'image-preview')), 'image-preview')), + 'lazyload': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/lazyload/demo'), 'lazyload')), 'lazyload')), + 'list': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/list/demo'), 'list')), 'list')), + 'loading': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/loading/demo'), 'loading')), 'loading')), + 'nav-bar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/nav-bar/demo'), 'nav-bar')), 'nav-bar')), + 'notice-bar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/notice-bar/demo'), 'notice-bar')), 'notice-bar')), + 'number-keyboard': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/number-keyboard/demo'), 'number-keyboard')), 'number-keyboard')), + 'pagination': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/pagination/demo'), 'pagination')), 'pagination')), + 'panel': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/panel/demo'), 'panel')), 'panel')), + 'password-input': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/password-input/demo'), 'password-input')), 'password-input')), + 'picker': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/picker/demo'), 'picker')), 'picker')), + 'popup': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/popup/demo'), 'popup')), 'popup')), + 'progress': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/progress/demo'), 'progress')), 'progress')), + 'pull-refresh': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/pull-refresh/demo'), 'pull-refresh')), 'pull-refresh')), + 'radio': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/radio/demo'), 'radio')), 'radio')), + 'rate': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/rate/demo'), 'rate')), 'rate')), + 'search': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/search/demo'), 'search')), 'search')), + 'sku': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/sku/demo'), 'sku')), 'sku')), + 'slider': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/slider/demo'), 'slider')), 'slider')), + 'stepper': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/stepper/demo'), 'stepper')), 'stepper')), + 'steps': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/steps/demo'), 'steps')), 'steps')), + 'submit-bar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/submit-bar/demo'), 'submit-bar')), 'submit-bar')), + 'swipe': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/swipe/demo'), 'swipe')), 'swipe')), + 'switch': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/switch/demo'), 'switch')), 'switch')), + 'switch-cell': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/switch-cell/demo'), 'switch-cell')), 'switch-cell')), + 'tab': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/tab/demo'), 'tab')), 'tab')), + 'tabbar': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/tabbar/demo'), 'tabbar')), 'tabbar')), + 'tag': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/tag/demo'), 'tag')), 'tag')), + 'toast': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/toast/demo'), 'toast')), 'toast')), + 'tree-select': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/tree-select/demo'), 'tree-select')), 'tree-select')), + 'uploader': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/uploader/demo'), 'uploader')), 'uploader')), + 'vant-css': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/vant-css/demo'), 'vant-css')), 'vant-css')), + 'waterfall': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('../../packages/waterfall/demo'), 'waterfall')), 'waterfall')) +}; diff --git a/docs/src/doc.config.js b/docs/src/doc.config.js index d34b0ed1d..f9e54d1dc 100644 --- a/docs/src/doc.config.js +++ b/docs/src/doc.config.js @@ -38,7 +38,7 @@ module.exports = { noExample: true }, { - path: '/built-in-style', + path: '/vant-css', title: '内置样式' }, { @@ -69,7 +69,7 @@ module.exports = { groupName: '基础组件', list: [ { - path: '/layout', + path: '/col', title: 'Layout - 布局' }, { @@ -277,12 +277,12 @@ module.exports = { title: 'Card - 卡片' }, { - path: '/contact', + path: '/contact-card', title: 'Contact - 联系人' }, { - path: '/coupon', - title: 'Coupon - 优惠券选择器' + path: '/coupon-list', + title: 'Coupon - 优惠券' }, { path: '/goods-action', @@ -340,7 +340,7 @@ module.exports = { noExample: true }, { - path: '/built-in-style', + path: '/vant-css', title: 'Built-in style' }, { @@ -371,7 +371,7 @@ module.exports = { groupName: 'Basic Components', list: [ { - path: '/layout', + path: '/col', title: 'Layout' }, { @@ -579,11 +579,11 @@ module.exports = { title: 'Card' }, { - path: '/contact', + path: '/contact-card', title: 'Contact' }, { - path: '/coupon', + path: '/coupon-list', title: 'Coupon' }, { diff --git a/docs/src/router.js b/docs/src/router.js index 08c8fff13..c7031e214 100644 --- a/docs/src/router.js +++ b/docs/src/router.js @@ -1,7 +1,7 @@ import docConfig from './doc.config'; import DemoList from './components/DemoList'; import componentDocs from '../markdown'; -import componentDemos from '../demos'; +import componentDemos from './demo-entry'; import DemoPages from './components/DemoPages'; import Vue from 'vue'; import './utils/iframe-router'; diff --git a/docs/demos/views/actionsheet.vue b/packages/actionsheet/demo/index.vue similarity index 99% rename from docs/demos/views/actionsheet.vue rename to packages/actionsheet/demo/index.vue index 77f47277e..0854d726d 100644 --- a/docs/demos/views/actionsheet.vue +++ b/packages/actionsheet/demo/index.vue @@ -62,7 +62,7 @@ export default { onClick(item) { Toast(item.name); }, - + handleCancel() { Toast('cancel'); } diff --git a/docs/demos/views/address-edit.vue b/packages/address-edit/demo/index.vue similarity index 96% rename from docs/demos/views/address-edit.vue rename to packages/address-edit/demo/index.vue index 97774dfec..922fba0e7 100644 --- a/docs/demos/views/address-edit.vue +++ b/packages/address-edit/demo/index.vue @@ -17,7 +17,7 @@