Skip to content

MPComponent/mpvue-weui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

739001b · Oct 9, 2019
Oct 18, 2018
Sep 28, 2019
Sep 2, 2018
Sep 1, 2018
Oct 9, 2019
Sep 28, 2019
Sep 28, 2019
Sep 30, 2018
Sep 1, 2018
Sep 1, 2018
Sep 1, 2018
Oct 15, 2018
Sep 6, 2018
Sep 1, 2018
Sep 1, 2018
Oct 9, 2019
Oct 15, 2018
Sep 1, 2018
Oct 9, 2019
Sep 6, 2018
Sep 28, 2019
Oct 9, 2019

Repository files navigation

mpvue-weui logo

npm npm

Mpvue-WeUI

Mpvue-WeUI是基于 mpvue 的一个小程序 UI 框架, 保留了 weui 的视觉规范,旨在提高小程序开发体验,同时让用户的使用感知更加统一。

文档

mpvue-weui 文档

扫码体验

安装

npm install mpvue-weui

or

yarn add mpvue-weui

使用

/* 全局引入 weui.css (在 `src/main.js` 中引入 weui.css) */
import 'mpvue-weui/src/style/weui.css';
<template>
  <mp-button type="primary" size="large" btnClass="mb15">默认按钮</mp-button>
</template>
<script>
  import mpButton from 'mpvue-weui/src/button';
  export default {
    components: {
      mpButton,
    },
  }
</script>
  • 目前由于 mpvue 暂不支持全局安装组件,因此只能通过页面单独引入。
  • 更多组件

开发预览

1. git clone
git clone [email protected]:MPComponent/mpvue-weui.git

2. 安装依赖
npm install

3. 启动程序
npm run dev

4. 预览
打开微信开发者工具,新建项目,将目录指向 /dist 即可

相关说明

之前写了 用 vue 写小程序,基于 mpvue 框架重写 weui,这个是在 mpvue 开源之初写的,开始的目的是想重写下 weui,然后写了一些踩坑文档。可能有点遗憾的是没有对其进行完整的封装,以至于在使用过程中就很不方便,在 issues 中也看到一些关于能不能封装成一个独立的 UI 框架的想法,加上大家也给了这个仓库这么多 ⭐️ ⭐️ ,因此决定将其封装成一个独立的 UI 框架:mpvue-weui

贡献

欢迎各位大佬贡献代码,贡献方法如下:

  • fork 本仓库到自己账户下
  • 提交变更
  • PR 到本仓库 (dev 分支)
  • 等待 Review