相信接触过微信小程序一段时间的开发者或者开发团队或多或少都会为自己搭建一些框架/脚手架来封装、方便开发。尤其是那些做过Web开发的开发者,受到当前主流Web开发框架的影响。比如受Vue等核心思想的影响,对数据/状态管理、组件化、跨平台等有更高的追求。
因此,从小程序出现到现在,一些遵循这些Web开发思想的小程序框架也相继出现。最突出的就是腾讯团队推出的小程序组件开发框架WePY。其主要特点如下:
这些功能基本上是当今主流Web开发的标准功能。由于我在开发Web应用时经常使用Vue,所以在试用WePY的过程中感觉非常熟悉且易于使用。确实是一个值得使用的好框架,可以有效提高生产力。
不过,今天的主角并不是类似Vue的框架WePY。我想说的是另一个基于Vue的框架:美团点评团队出品的小程序开发框架:。为什么说WePY是一个“类似Vue”的框架,而这是一个“基于Vue”的框架呢?因为WePY在代码开发风格上借鉴了Vue,所以与Vue本身无关;而这是对Vue整个核心代码进行二次开发形成的框架,相当于给Vue本身赋能,增加了开发微信小程序的能力。
通过开发小程序,您将基于小程序技术体系获得以下能力:
它的目标是:未来最理想的状态,一套代码可以直接运行在多个终端:WEB、微信小程序、支付宝小程序(借助weex)。但由于各端之间存在一些明显的差异,从产品层面来说,不建议这样做。该框架的官方只期望一致的开发和调试体验。
通过官网提供的五分钟快速入门教程,可以发现它的开发流程与Vue高度一致,甚至使用的命令行工具仍然是最初用来开发Web应用的vue-cli:
#创建一个小程序工程 vue init mpvue/mpvue-quickstart my-project

在编写模板代码时,我们通常关注HTML。例如,当我们编写.vue组件时,我们编写以下代码:
这个HTML模板会通过编译转换成小程序的WXML代码:
Vuex counter:{{ count }} + - 去往首页
这样我们就可以完全像开发Web应用一样开发小程序了,为我们减少了一些思维转换的成本。其实最重要的是:
Vue 真的很容易使用!
此外,还对原生微信小程序和WePY三种小程序开发方式进行了对比。有兴趣的朋友可以参考一下: