6篇干货带你学会用vue开发小程序——mpvue

Dear 丶 2022-12-18 15:52 120阅读 0赞

## **\#第  003 期\#** ##

前段时间，美团开源了`mpvue`这个项目，使得我们又多了一种用来开发小程序的框架选项。由于`mpvue`框架是完全基于Vue框架的（重写了其runtime和compiler），因此在用法上面是高度和Vue一致的（某些功能由于受限于小程序环境本身的原因而不能使用），这给使用过Vue开发Web应用的前端开发者提供了极低的切换门槛来开发小程序。

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

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

它的目标是：在未来最理想的状态下，可以一套代码可以直接跑在多端：WEB、微信小程序、支付宝小程序、Native（借助weex）。不过由于各个端之间都存在一些比较明显的差异性，从产品的层面上讲，不建议这么做，这个框架的官方他们对它的期望的也只是开发和调试体验的一致。

## [使用mpvue开发小程序教程（一）][mpvue]  52伐木累       ##

\- 美团开源了`mpvue`这个项目，使得我们又多了一种用来开发小程序的框架选项

## [使用mpvue开发小程序教程（二）][mpvue 1]  52伐木累       ##

\- mpvue项目的主要目录和文件结构。

## [使用mpvue开发小程序教程（三）][mpvue 2]  52伐木累       ##

\- 学习使用Vue的语法去编写小程序。

## [使用mpvue开发小程序教程（四）][mpvue 3]  52伐木累       ##

\- 了解和学习`mpvue / Vue`的其他重要功能。

## [使用mpvue开发小程序教程（五）][mpvue 4]  52伐木累       ##

\- 在使用mpvue的时候那些需要特别注意的点

## [Mpvue开发小程序入门实战视频教程][Mpvue]      phonegap中文网 ##

\- Mpvue是当前最火的小程序开发框架

[mpvue]: https://mp.weixin.qq.com/s?__biz=MzI1MTMwMDA0OQ%3D%3D&idx=2&mid=2247483716&scene=21&sn=298f9e55d4deabf573a9de114fd3b558#wechat_redirect
[mpvue 1]: https://mp.weixin.qq.com/s?__biz=MzI1MTMwMDA0OQ%3D%3D&idx=4&mid=2247483745&scene=21&sn=1a95bf82239a12bed5a577749a92aa86#wechat_redirect
[mpvue 2]: https://mp.weixin.qq.com/s?__biz=MzI1MTMwMDA0OQ%3D%3D&idx=5&mid=2247483745&scene=21&sn=c964d8213462f0b8f8d35626d37f9f96#wechat_redirect
[mpvue 3]: https://mp.weixin.qq.com/s?__biz=MzI1MTMwMDA0OQ%3D%3D&idx=4&mid=2247483757&scene=21&sn=313b8cfbcb098a2e034db54e7a7f08ac#wechat_redirect
[mpvue 4]: https://mp.weixin.qq.com/s?__biz=MzI1MTMwMDA0OQ%3D%3D&idx=3&mid=2247483772&scene=21&sn=814760dfbc29c011916d0e4c28fbc50f#wechat_redirect
[Mpvue]: https://mp.weixin.qq.com/s?__biz=MzA4ODMwMzYwMA%3D%3D&idx=1&mid=2452863432&scene=21&sn=7da40f3a14ec689135b9dccce7758bf6#wechat_redirect