Vue 3 带来了许多令人兴奋的新特性，这其中最令人期待的莫过于 Composition API，它带来了更灵活的代码组织方式，更好的 TS 支持，以及更强大的逻辑复用能力。如今 Vue 3 已经发布一年有余，各项周边配套也已基本完善，可以说它已经准备好被用于生产了。你或许早已摩拳擦掌跃跃欲试，但作为国内开发者你却可能面临着一个很尴尬的处境，那就是你的主要工作也许是写小程序，这一切令人激动的消息好像与你并没有什么关系。但是如果你能用 Vue 3 的 Composition API 写小程序呢？
介绍
向大家隆重介绍 Vue Mini，Vue Mini 是一个基于 Vue 3 的小程序库，它能让你用 Composition API 写小程序。Vue Mini 底层直接且仅依赖 Vue 3 的响应式核心 @vue/reactivity，它完整继承了 Vue 3 的响应式数据，并且设计了与 Composition API 一模一样的 API，当然也拥有一模一样的能力。用 Vue Mini 写小程序就像在写 Vue 3 一样。
动机
小程序本就自带一个框架，为什么还要大费周章的移植别的框架呢？这是因为小程序自身的框架在几年前或许还差强人意，但如今却很难让人满意了。现在 TS 越来越受欢迎，而小程序自身对 TS 的支持却很羸弱。并且当小程序组件变大时，你也不能按逻辑关注点来组织代码，这可能会导致组件难以阅读和理解。最后小程序提供的逻辑复用方案 Behavior 其实就是 Mixin，存在着与 Mixin 相同的限制，例如容易发生冲突，不能接收参数等。而这些问题恰巧也是 Vue 3 添加 Composition API 所解决的问题。所以 Vue Mini 将 Composition API 移植到小程序，从而解决了这些问题。它提供了非常好的 TS 支持，并且有很好的类型推导，很多时候你并不需要手写类型注解。你可以按逻辑关注点来组织代码，让复杂的组件更容易阅读和理解。你也能将任意逻辑提取为一个组合函数，你可以在任何组件中调用组合函数，你也可以向组合函数传递任何参数来改变它的逻辑，这大大提高了抽象逻辑的灵活性。
Dogfooding
Vue Mini 其实已经在我们公司内部孵化一年多的时间了，它已经先后被用于创新项目和正式的生产项目。之所以最近才开始宣传是因为在经过真实生产项目验证之前，我并不能确定它是可行的，所以过去一年我都在 Dogfooding（使用自己的产品）。非常幸运，在团队小伙伴的信任和支持下，我们用 Vue Mini 写的第一个生产小程序最近已经成功上线了，最新上线的版本一共包含 58 个页面，几乎全都是用 Vue Mini 写的。我现在十分确定 Vue Mini 是可行的，在经过生产项目打磨后，它的质量已经比较可靠了，API 也比较稳定了。我认为现在是时候让更多的人知道它的存在了，它或许也能解决你的一些问题。如果你对 Vue Mini 感兴趣，想将其引入到你个人或工作的小程序中，一个保险也更具说服力的做法是先在小程序的部分页面或组件中小规模使用，等你或你的小伙伴逐渐信任它之后，再慢慢扩大使用范围。如果你在使用过程中遇到任何问题或是 Bug，欢迎提交 Issue，我将第一时间解决修复。
比较
如果你想要了解 Vue Mini 跟其他一些小程序框架的区别，可以参考文档的比较章节。
尝试一下!
使用以下命令，你可以快速搭起一个基于 Vue Mini 的小程序：
npm install -g sao@beta
# Then
sao vue-mini/template new-miniprogram
最后欢迎分享、转载本文，让更多的人知道 Vue Mini。
点赞加关注，永远不迷路
网友评论