美团开源出品:mpvue基于 Vue.js 的小程序开发框架

 快典   2018-04-19 22:16   638 人阅读  0 条评论

mpvue 是一个使用 Vue.js 开发小程序的前端框架。框架基于 Vue.js 核心,mpvue 修改了 Vue.js 的 runtime 和 compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验。通过编写 Vue.js 代码完成小程序开发,通过该框架,开发者将获得真正的组件化开发能力,拥有完整的 Vue.js 开发体验和配套设施。

主要特性

使用 mpvue 开发小程序,你将在小程序技术体系的基础上获取到这样一些能力:

  • 彻底的组件化开发能力:提高代码复用性
  • 完整的 Vue.js 开发体验
  • 方便的 Vuex 数据管理方案:方便构建复杂应用
  • 快捷的 webpack 构建机制:自定义构建策略、开发阶段 hotReload
  • 支持使用 npm 外部依赖
  • 使用 Vue.js 命令行工具 vue-cli 快速初始化项目
  • H5 代码转换编译成小程序目标代码的能力

配套设施

mpvue 作为小程序版本的 Vue.js,在框架 SDK 之外,完整的技术体系还包括如下设施。

实践案例

美团旗下小程序:美团火车票12306抢票美团汽车票美团充电

文档

mpvue 文档

H5 和小程序如何复用代码

先来看一段视频

在左侧为已经上线的 H5 页面,右侧为同代码的小程序页面,其中只需要更改小部分平台差异代码和更新下 webpack 的建构配置就可以直接运行。

在未来最理想的状态是,可以一套代码可以直接跑在多端:WEB、小程序(微信和支付宝)、Native(借助weex)。

当然从产品的层面,我们不建议这么做,各个端有自己的差异性,我们期望的只是开发和调试体验一致。

 

github项目地址:

https://github.com/Meituan-Dianping/mpvue

 

 

 

PREVIOUS:已经是最后一篇了
NEXT:已经是最新一篇了

 发表评论


表情