mpvue搭建、UI组件库及引入echarts的适配总结

1、快速上手,搭建mpvue小程序项目 http://mpvue.com/mpvue/quickstart/

2、mpvue搭建与使用手册
mpvue介绍 http://mpvue.com/
mpvue使用手册 http://mpvue.com/mpvue/

3、UI库
3.1 基于mpvue 的一个小程序 UI 框架,实现组件化,支持 npm 安装,但是不支持全局安装,并且内容比较少。
源码 https://github.com/MPComponent/mpvue-weui
文档 https://mpcomponent.github.io/mpvue-weui/
3.2 该仓库是基于 mpvue 重写 WeUI,是一个 demo 库,没有实现组件化,但是内容相对上面的比较多,可以下载源码,并且是github上star和fork最多的
源码 https://github.com/KuangPF/mpvue-weui
文档 https://kuangpf.com/mpvue-weui/#/
3.3 补充:mpvue 可以支持小程序的原生组件
源码 https://github.com/wechat-miniprogram/miniprogram-demo
文档 https://developers.weixin.qq.com/miniprogram/dev/component/view.html

4、小程序mpvue下的像素单位

var px2rpxLoader = {
   	loader: 'px2rpx-loader',
   	options: {
     	baseDpr: 1,
     	rpxUnit: 0.5
   	}
}

小程序配套设施px2rpx-loader样式转换插件,会将px装换成rpx,默认转换1px = 2rpx,并且支持1rpx = 1rpx,但是我们引的一些插件比如echarts,单位是px,默认装成2rpx,(这里面会将所有的单位扩大两倍,如果再将使用的部分缩小2倍,可能牵扯的就比较多了),这时建议统一配置rpxUnit : 1,这样就不会担心引插件转成rpx,并且按设计稿量出来的尺寸写成px即可。

总结:其实会写vue也就会写mpvue了

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值