开源框架
1、 mpvue

mpvue 是美团点评开源的一个使用 Vue.js 开发小程序的前端框架。框架基于 Vue.js 核心,mpvue 修改了 Vue.js 的  runtime 和  compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验。使用  mpvue 开发小程序,你将在小程序技术体系的基础上获取到这样一些能力:

彻底的组件化开发能力:提高代码复用性

完整的 Vue.js 开发体验

方便的 Vuex 数据管理方案:方便构建复杂应用

快捷的 webpack 构建机制:自定义构建策略、开发阶段 hotReload

支持使用 npm 外部依赖

使用 Vue.js 命令行工具 vue-cli 快速初始化项目

H5 代码转换编译成小程序目标代码的能力

Github:https://github.com/Meituan-Di...

官网:http://mpvue.com/

2、Tina.js

Tina.js 一款轻巧的渐进式微信小程序框架。

特性: 轻盈小巧。 极易上手,保留 MINA (微信小程序官方框架) 的大部分 API 设计;无论你有无小程序开发经验,都可以轻松过渡上手。 渐进增强,既有状态管理器,也有路由增强,还可以自己编写插件。

Tina.js 开源框架地址:https://github.com/tinajs/tina

3、Taro

Taro 是由京东 - 凹凸实验室打造的一套遵循 React 语法规范的多端统一开发框架。我要没记错的话,是最近刚刚开源的。

使用 Taro,我们可以只书写一套代码,再通过 Taro 的编译工具,将源代码分别编译出可以在不同端(微信小程序、H5、App 端等)运行的代码。同时 Taro 还提供开箱即用的语法检测和自动补全等功能,有效地提升了开发体验和开发效率。

官网:http://taro.aotu.io/

GitHub: http://github.com/nervjs/taro

4、wepy

WePY 是一款让小程序支持组件化开发的框架,通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。框架的细节优化,Promise,Async Functions 的引入都是为了能让开发小程序项目变得更加简单,高效。

特性:

类 Vue 开发风格

支持自定义组件开发

支持引入 NPM 包

支持 Promise

支持 ES2015 + 特性,如 Async Functions

支持多种编译器,Less/Sass/Styus、Babel/Typescript、Pug

支持多种插件处理,文件压缩,图片压缩,内容替换等

支持 Sourcemap,ESLint 等

小程序细节优化,如请求列队,事件优化等

Github :https://github.com/Tencent/wepy

官网:https://tencent.github.io/wepy

5、weweb

weweb 是一个兼容小程序语法的前端框架,你可以用小程序的写法,来写 web 应用。如果你已经有小程序了,通过它你可以将你的小程序运行在浏览器中。

特性: 跨平台,一套代码多端运行(小程序、h5、未来直接打包成安卓、ios app 也不是梦) 自带常用组件,完美继承了小程序内置组件 兼容小程序 rpx 语法,使页面更容易适配各种机型

GitHub:https://github.com/wdfe/weweb

组件库
还有各种开源的组件库,比如有以下这几个:

有赞的 zanui-weapp 和 iview 这两个比较出名。

这两个组件库我之前在我的公众号都推荐过,具体用法和功能我就不多介绍了,自己找我以前的推文或者自己搜索一下就很清楚了。用法很简单。

大餐来了
上面介绍了 5 个开源框架和两个组件库,我并不是说上面的不好,上面的绝对都很好,不管上面的几个开源框架还是组件库都是大厂产品,都很好。但是他们仅仅就是开源框架就是开源框架,组件库就是组件库。一直没有满足我单独针对微信小程序开发的痛点。

小程序开发一个是开源框架的好用,另外一个就是丰富的组件库,单纯官方推出的并不能满足我们的需要,上面的框架和组件库都是分开的。所以并不能解决我的痛点。而今天我推荐的这个开源框架既能提供框架也丰富扩展了很多组件,使我们开发的时候不用担心再自己封装组件了。

其实上面分享的组件库有一个重大的缺点,他们组件库足够丰富,但是对于样式的自定义很死板,不灵活,但是今天的这个就灵活多了。

我给大家推荐的这个开源框架就是:touchwx。

Touch WX 是一套完全免费的微信小程序开发框架,包含丰富的 UI 控件用于官方组件的补充。特点如下:

1、组件扩充:

增加了 30 多种常用的组件用于官方组件的补充。

2、功能扩充:

兼容阿里的 iconfont 图标库,海量矢量图标随意使用;补充了常用样式库、支持 less 语法、支持全局配置主题色等

3、开发体验改善:

四文件方式改为单文件方式,通过 VSCode 编辑器 + 插件的方式开发,拥有 web 开发体验;

4、小程序转为 H5 应用:

可以与 H5 开发框架 Touch UI 工程相互转换,发布成 webApp。开发一套代码,拥有两套应用。

这套框架的原理是:

将 Touch WX 工程中所写的代码进行编译,直接输出为微信小程序工程原始代码。扩充的 30 多种组件,完全是基于小程序官方的自定义组件机制实现(row&col 除外)。

所以它支持小程序的全部语法,怎么开发小程序,就怎么开发 Touch WX。

不过因为是单文件的开发方式,在文件的代码结构上稍有不同。请注意这一点。

这样好处在于:

1、开发者迁移成本很小。

可以轻松的将已有的小程序移植为 Touch WX 工程,来使用它的扩展能力;

2、便于排查错误。

当遇到问题时,开发者也可以随时查看输出的小程序原始代码来定位问题所在。不会搞不清楚到底是框架问题还是自己代码的问题;

3、按需编译

由于小程序对体积有限制,在使用框架开发时,只有使用到的组件才会编译输出为小程序源码。没用到的不会输出。

4、不会对框架产生依赖。

以后不想用了这套框架,可以直接对已经输出的小程序工程进行维护。

目前我认为单独针对小程序开发的话,这个开源框架是最适合我们的,效率也是最高的。

GitHub:https://github.com/uileader/t...

官网:https://www.wetouch.net/wx.html

最后,大家可以长按下方二维码,体验一下:

今天的货其实挺干的,但是越干的货,可能看得人就越少,还是希望大家多多支持,并转发,让更多的人知道这样好用的开发框架。

作者:非著名程序员_
来源:CSDN
原文:https://blog.csdn.net/OQjya20...
版权声明:本文为博主原创文章,转载请附上博文链接!

推荐常用的小程序Ui框架相关推荐

  1. 22款常用微信小程序UI框架推荐!

    22个好看.常用的微信小程序UI组件库推荐! 1. WeUI 地址:https://developers.weixin.qq.com/miniprogram/dev/extended/weui/ 预览 ...

  2. 多文档程序 两个menu框架_汇总9款优秀的开源小程序UI框架

    卧槽这玩意儿写的这么烂,我可以写一个更烂的来恶心作者--开源社区,经典语录 随着小程序日渐火爆,各种不同类型的小程序也渐渐更新,其中不乏一些优秀好用的框架/组件库. 布莱恩特:Github优秀的小程序 ...

  3. 基于H5 小程序 UI框架选型 2020年9月10号

    基于H5 小程序 UI框架选型 选型标准: 1. 便于后面项目小程序 app等改造 2. 开发轻便 3. 学习成本低 4. 框架生态完整 一.方案确定 方案1 (使用原生HTML+CSS实现) 优点 ...

  4. 上传文件 微信小程序input_快速上手微信小程序UI框架

    本课程属于 微信小程序 A计划,不单独售卖,加入 A 计划可免费观看本课程及所有 微信小程序 收费课程~ 微信小程序 A计划永久有效期购买链接: http://www.sikiedu.com/clas ...

  5. 后端程序员转行前端,强烈推荐这6个前端UI框架,第二款小程序UI框架颜值最高!...

    昨天有个同事问我有没有可以直接上手的前端UI框架. 那今天就给大家推荐6个简单.视觉体验好的前端框架 没吃过猪肉,肯定见过猪跑! Jquery Mobile demo地址: https://demos ...

  6. 后端程序员转行前端,强烈推荐这6个前端UI框架,第二款小程序UI框架颜值最高!

    昨天有个同事问我有没有可以直接上手的前端UI框架. 那今天就给大家推荐6个简单.视觉体验好的前端框架 没吃过猪肉,肯定见过猪跑! Jquery Mobile demo地址: https://demos ...

  7. 分享一个高质量的 小程序UI框架

    先上ui 地址 github.com/weilanwl/Co- 先看这里,我感觉这个ui开源作者肯定是一位ui设计师,介绍就已经很高颜值了,下面我们来观看一下这个ui框架,这个ui框架和其他ui框架不 ...

  8. 小程序UI框架minui

    市面上小程序的UI框架似乎很少,不过合理的使用UI框架确实能帮助我们节省一些时间.同时考虑到知乎上评价minui与wepy的兼容性相对比较好,所以使用wepy的小伙伴可以了解一下. //安装minui ...

  9. 里面使用轮播_小程序ColorUI框架初步使用教程及个人项目实战

    小程序ColorUI框架初步使用教程及个人项目实战 最近在写自己的一个微信小程序项目<阿涛技术博客>,目前还在写前端小程序部分,之前我有用过小Weiui,Linui等微信小程序UI框架,在 ...

最新文章

  1. 如何解决经常出现Windows数据执行保护的提示?
  2. axios请求GBK页面中文乱码解决方法
  3. oracle解除锁表【原】
  4. R6034--ARCENGINE
  5. ASP.Net分页组件1.0开发下载了...
  6. Linux用户和用户组管理常见问题
  7. C#阻塞队列BlockingCollection
  8. C语言动态内存管理和动态内存分配
  9. linux popd 命令,Linux中的pushd推入和popd弹出命令
  10. STM32 的RAM跑到哪里去了
  11. 3500x架构_如何评价超威半导体(AMD)新发布的 锐龙(Ryzen)3500X?
  12. SharePoint Framework 企业向导(二)
  13. 只有搞Java开发的才知道!javaspring菜鸟教程
  14. LaTeX中的特殊符号,数学公式符号的相关写法
  15. Arm V8内存管理架构.学习笔记
  16. 关于前后台部署打包时需要修改的ip位置
  17. PLC与运动控制器有什么不同?为什么运动控制器比PLC好?
  18. 偏差代替误差进行稳态分析
  19. 解决Mybatis3.3中NVARCHAR2生僻字乱码
  20. 20201218英语单词学习(仅供自己记录)

热门文章

  1. BP(反向传播)神经网络
  2. 时隔25年重访 Linus:流量时代的“技术大师”
  3. postman 字符串中有冒号_【接口测试】Postman入门09 Postman获取HTTP请求
  4. 怎样退出python的交互环境_python交互界面的退出方法
  5. python用户界面画图_通过海龟绘图学习Python-01
  6. 服务器进bios修改启动顺序,服务器进入bios设置u盘启动
  7. 计算机基础应用000018,计算机应用基础第01章计算机基础知识
  8. CSS的Padding, Margin, Border 的区别
  9. Excel 宏写入文件乱码解决
  10. dqn在训练过程中loss越来越大_深度强化学习——从DQN到DDPG