├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── LICENSE ├── README.md ├── package.json ├── src ├── app.wpy ├── example │ ├── actionsheet.wpy │ ├── article.wpy │ ├── badge.wpy │ ├── button.wpy │ ├── dialog.wpy │ ├── flex.wpy │ ├── footer.wpy │ ├── gallery.wpy │ ├── grid.wpy │ ├── icons.wpy │ ├── index.wpy │ ├── input.wpy │ ├── list.wpy │ ├── loadmore.wpy │ ├── msg.wpy │ ├── msg_fail.wpy │ ├── msg_success.wpy │ ├── navbar.wpy │ ├── panel.wpy │ ├── picker.wpy │ ├── preview.wpy │ ├── progress.wpy │ ├── searchbar.wpy │ ├── slider.wpy │ ├── tabbar.wpy │ ├── toast.wpy │ └── uploader.wpy ├── images │ ├── base64.js │ ├── icon_footer.png │ ├── icon_footer_link.png │ ├── icon_intro.png │ ├── icon_nav_feedback.png │ ├── icon_nav_form.png │ ├── icon_nav_nav.png │ ├── icon_nav_search.png │ ├── icon_nav_special.png │ ├── icon_nav_widget.png │ ├── icon_nav_z-index.png │ ├── icon_tabbar.png │ ├── logo.png │ ├── pic_160.png │ ├── pic_article.png │ └── vcode.png ├── index.template.html └── style │ ├── base │ ├── fn.less │ ├── mixin │ │ ├── setArrow.less │ │ ├── setOnepx.less │ │ └── text.less │ ├── reset.less │ └── variable │ │ ├── color.less │ │ ├── global.less │ │ ├── weui-button.less │ │ ├── weui-cell.less │ │ ├── weui-dialog.less │ │ ├── weui-grid.less │ │ ├── weui-msg.less │ │ └── weui-progress.less │ ├── weui.less │ └── widget │ ├── weui-agree │ └── weui-agree.less │ ├── weui-animate │ └── weui-animate.less │ ├── weui-button │ └── weui-button.less │ ├── weui-cell │ ├── weui-access.less │ ├── weui-cell.less │ ├── weui-check.less │ ├── weui-form.less │ ├── weui-form │ │ ├── weui-form-preview.less │ │ ├── weui-form_common.less │ │ ├── weui-select.less │ │ └── weui-vcode.less │ ├── weui-switch.less │ └── weui-uploader.less │ ├── weui-flex │ └── weui-flex.less │ ├── weui-footer │ └── weui-footer.less │ ├── weui-grid │ └── weui-grid.less │ ├── weui-loading │ └── weui-loading.less │ ├── weui-media-box │ └── weui-media-box.less │ ├── weui-page │ ├── weui-article.less │ └── weui-msg.less │ ├── weui-panel │ └── weui-panel.less │ ├── weui-progress │ └── weui-progress.less │ ├── weui-searchbar │ └── weui-searchbar.less │ ├── weui-tab │ ├── weui-navbar.less │ └── weui-tab.less │ └── weui-tips │ ├── weui-badge.less │ └── weui-loadmore.less ├── web ├── images │ ├── icon_footer.png │ ├── icon_footer_link.png │ ├── icon_intro.png │ ├── icon_nav_feedback.png │ ├── icon_nav_form.png │ ├── icon_nav_nav.png │ ├── icon_nav_search.png │ ├── icon_nav_special.png │ ├── icon_nav_widget.png │ ├── icon_nav_z-index.png │ ├── icon_tabbar.png │ ├── logo.png │ ├── pic_160.png │ ├── pic_article.png │ └── vcode.png ├── index.html └── index.js └── wepy.config.js /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 4 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | dist/* 2 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: 'babel-eslint', 4 | parserOptions: { 5 | sourceType: 'module' 6 | }, 7 | env: { 8 | browser: true 9 | }, 10 | // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style 11 | extends: 'standard', 12 | // required to lint *.wpy files 13 | plugins: [ 14 | 'html' 15 | ], 16 | settings: { 17 | 'html/html-extensions': ['.html', '.wpy'] 18 | }, 19 | 'globals': { 20 | 'wx': true 21 | }, 22 | // add your custom rules here 23 | 'rules': { 24 | // allow paren-less arrow functions 25 | 'arrow-parens': 0, 26 | // allow async-await 27 | 'generator-star-spacing': 0, 28 | "semi": [ 29 | "error", 30 | "always" 31 | ], 32 | 'comma-dangle': ["error", "only-multiline"], 33 | 'padded-blocks': 0, 34 | 'one-var': 0, 35 | 'no-return-assign': 0, 36 | 'indent': ['error', 4], 37 | // allow debugger during development 38 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 39 | 'space-before-function-paren': 0 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | node_modules/ 3 | web/style 4 | sftp-config.json 5 | log 6 | npm-debug.log 7 | .vscode 8 | coverage 9 | lerna-debug.log 10 | .DS_Store 11 | .wepycache 12 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 wepyjs 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # WeUI in WePY 2 | 3 | [WeUI](https://github.com/weui/weui-wxss) 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。 4 | 这里是 WeUI 在 WePY 中的使用示例。 5 | 6 | ## 预览 7 | 8 | [Web 版线上DEMO](https://www.madcoder.cn/demos/wepy-weui-demo/index.html) 9 | 10 | ![image](https://cloud.githubusercontent.com/assets/2182004/26298989/c0ae78b2-3f0b-11e7-8979-e37884a86a43.png) 11 | 12 | ## 体验步骤 13 | 14 | ### 1. 安装 wepy 15 | 本项目基于wepy开发，[参考这里](https://github.com/wepyjs/wepy) 16 | ```bash 17 | npm install wepy-cli -g 18 | ``` 19 | 20 | ### 2. 下载源代码 21 | ```bash 22 | git clone git@github.com:wepyjs/wepy-weui-demo.git 23 | ``` 24 | 25 | ### 3. 安装开发依赖 26 | ```bash 27 | npm install 28 | ``` 29 | 30 | ### 4. 编译源代码 31 | ```bash 32 | wepy build 33 | ``` 34 | 35 | ### 5.导入至开发者工具 36 | 37 | 编译完成后会生成`dist`目录，开发者工具本地开发目录指向`dist`目录。 38 | 39 | **切记： 取消勾选`项目-->开启ES6转ES5`，否则代码运行报错。** 40 | 41 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "wepy-weui-demo", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "dist/app.js", 6 | "scripts": { 7 | "build": "cross-env NODE_ENV=production wepy build --no-cache", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "author": "", 11 | "license": "MIT", 12 | "dependencies": { 13 | "wepy": "^1.5.1", 14 | "wepy-async-function": "^1.4.4", 15 | "wepy-com-toast": "^1.0.1" 16 | }, 17 | "devDependencies": { 18 | "babel-eslint": "^7.2.1", 19 | "babel-plugin-syntax-export-extensions": "^6.13.0", 20 | "babel-plugin-transform-export-extensions": "^6.22.0", 21 | "babel-preset-es2015": "^6.24.0", 22 | "babel-preset-stage-1": "^6.22.0", 23 | "cross-env": "^3.2.4", 24 | "eslint": "^3.18.0", 25 | "eslint-config-standard": "^7.1.0", 26 | "eslint-friendly-formatter": "^2.0.7", 27 | "eslint-plugin-html": "^2.0.1", 28 | "eslint-plugin-promise": "^2.0.1", 29 | "eslint-plugin-standard": "^2.0.1", 30 | "wepy-compiler-babel": "^1.5.1", 31 | "wepy-compiler-less": "^1.3.10", 32 | "wepy-eslint": "^1.5.2", 33 | "wepy-plugin-imagemin": "^1.5.2", 34 | "wepy-plugin-uglifyjs": "^1.3.6" 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /src/app.wpy: -------------------------------------------------------------------------------- 1 | 37 | 38 | 100 | -------------------------------------------------------------------------------- /src/example/actionsheet.wpy: -------------------------------------------------------------------------------- 1 | 6 | 19 | 20 | 38 | -------------------------------------------------------------------------------- /src/example/article.wpy: -------------------------------------------------------------------------------- 1 | 9 | 47 | 48 | 55 | -------------------------------------------------------------------------------- /src/example/badge.wpy: -------------------------------------------------------------------------------- 1 | 57 | 58 | 65 | -------------------------------------------------------------------------------- /src/example/button.wpy: -------------------------------------------------------------------------------- 1 | 11 | 41 | 42 | 49 | -------------------------------------------------------------------------------- /src/example/dialog.wpy: -------------------------------------------------------------------------------- 1 | 6 | 20 | 21 | 56 | -------------------------------------------------------------------------------- /src/example/flex.wpy: -------------------------------------------------------------------------------- 1 | 12 | 45 | 46 | 53 | -------------------------------------------------------------------------------- /src/example/footer.wpy: -------------------------------------------------------------------------------- 1 | 9 | 47 | 48 | 55 | -------------------------------------------------------------------------------- /src/example/gallery.wpy: -------------------------------------------------------------------------------- 1 | 9 | 10 | 17 | -------------------------------------------------------------------------------- /src/example/grid.wpy: -------------------------------------------------------------------------------- 1 | 19 | 20 | 29 | -------------------------------------------------------------------------------- /src/example/icons.wpy: -------------------------------------------------------------------------------- 1 | 33 | 88 | 89 | 96 | -------------------------------------------------------------------------------- /src/example/index.wpy: -------------------------------------------------------------------------------- 1 | 56 | 87 | 88 | 135 | -------------------------------------------------------------------------------- /src/example/input.wpy: -------------------------------------------------------------------------------- 1 |