共计 2154 个字符，预计需要花费 6 分钟才能阅读完成。
Vant 是有赞前端团队开源的一套轻量、牢靠的挪动端组件库。
历经八个月时长的开发，Vant 3.0 终于和大家正式见面咯。在本次迭代中，咱们的次要工作是 基于 Vue 3 重构整个代码仓库和周边生态，并公布 Vant 3.0、Vant Cli 3.0 和 Vant Use 1.0。
回顾
依照常规，咱们先简略回顾一下 Vant 开源至今的问题：
- 270 位开发者 参加了 Vant 和 VantWeapp 开发，并奉献了 4100 个 Pull Request
- 7300 个 issue 被敞开，99.3% 的 issue 失去解决或回答
- 站点月访问量 800 万次
- CDN 月下载量 3 亿次
更新内容
Vant 3.0：全面拥抱 Vue 3 ????
Vue 3 带来了许多激动人心的新个性，比方 Composition API、emits Option 和 Teleport。在 Vant 3.0 中，咱们全面拥抱了 Vue 3 带来的各种变动，实现下列革新：
- 应用 Composition API 重构所有组件
- 应用 Composition API 重写所有文档和示例
- 组件减少 emits 选项，提供更好的事件提醒
- 移除所有 mixins，晋升代码可读性
- 所有弹窗类组件反对 teleport 属性
重构实现后，组件之间能够基于 Composition API 进行逻辑复用，代码的可压缩性也有所晋升。与 Vant 2.12 版本进行比照，能够看到 Vant 3.0 的 JS 体积 降落了 16.6%，Gzip 后体积降落至 67.5kb。
新组件：Vant 2、Vant 3 同步供给
Vant 3.0 中蕴含 3 个全新的组件，别离是：
- Badge 徽标：用于在右上角展现徽标数字或小红点。
- Popover 气泡弹出框：弹出式的气泡菜单组件。
- Cascader 级联选择器：用于多层级数据的抉择，典型场景为省市区抉择。
思考到大部分开发者依然在应用 Vue 2 进行开发，咱们在 Vant 2 中 同步实现了以上三个组件，大家能够降级到 Vant 2.12 版本进行应用。
Vant Use：新搭档 ????
Vant Use 从 Vant 中积淀出的 Composition API 库。除了提供罕用的 Composition API 外，Vant Use 也会将某些组件的逻辑抽离进去，让开发者在应用组件逻辑的同时，可能齐全自定义组件的展示模式。
上面是一个简略的例子，咱们将 CountDown 组件的倒计时逻辑形象为 useCountDown 办法，性能与 CountDown 组件根本等价，但应用起来更加灵便，咱们能够自定义倒计时的 UI 款式，或者通过 computed 对倒计时进行预处理。
Vant Use 依然处于晚期阶段，在将来的演进过程中，咱们会持续抽离 Vant 组件外部的通用逻辑，并下沉到 Vant Use 中。
Vant Cli 3.0：更新，更快 ????
Vant Cli 是 Vant 底层的组件库构建工具，通过 Vant Cli 能够疾速搭建一套性能齐备的 Vue 组件库。在 Vant Cli 3.0 中，咱们 对所有底层依赖进行了大版本升级，在反对 Vue 3 的同时，提供更晦涩的开发体验。
- 降级 Vue 3、VueRouter 4、VueLoader 16
- 降级 Webpack 5，开启长久缓存能力
- 降级 Docsearch 3，全新的搜寻框款式
- 降级 TypeScript 4、ESLint 7
在创立 vant-cli 工程时，你能够自由选择基于 Vue 2 或者 Vue 3 进行组件库开发：
Vant Demo：2 个新的示例工程
Vant Demo 是 Vant 官网提供的示例工程合集，在本次迭代中，咱们新增了 2 个示例工程，别离演示：
- 如何应用 Vue 3 + Vant 3 + Vue Cli 搭建利用
- 如何应用 Vue 3 + Vant 3 + Vite 搭建利用
许多喜爱尝鲜的小伙伴曾经在应用 Vite 进行开发了，在应用 Vite 的过程中，常常令大家困惑的一点是，如何在 Vite 中进行按需引入 Vant 组件。在 Vue Cli 中，咱们能够通过 babel-plugin-import 插件实现按需引入，但在 Vite 中无奈应用该插件。
其实在 Vite 中毋庸思考按需引入的问题。Vite 在构建代码时，会主动通过 Tree Shaking 移除未应用的 ESM 模块。而 Vant 3.0 外部所有模块都是基于 ESM 编写的，人造具备按需引入的能力。现阶段遗留的问题是，未应用的组件款式无奈被 Tree Shaking 辨认并移除，后续咱们会思考通过 Vite 插件的形式进行反对。
开始尝鲜
目前，Vant 官网默认展现 Vant 2 的 API 文档，你能够通过官网右上角的 版本切换按钮 拜访 Vant 3 的文档，也能够 ???? 点此拜访。
同时，Vant 的 npm latest 标签也放弃在 v2 版本，这意味着应用 npm install vant 命令仍会装置 Vant 2，而装置 Vant 3 须要应用 npm install vant@next 命令。在 Vue 的默认文档版本和 npm 标签切换为 v3 后，咱们也会同步进行切换。
从现有 Vant 2 我的项目降级，请参考 ???? 降级指南。
下一步打算
将来 6 ~ 12 个月内，咱们会放弃 Vant 2 和 Vant 3 的性能同步更新。随着 Vue 3 的遍及，咱们会逐渐升高 Vant 2 的保护频率，并将工作重心转移到 Vant 3 上。
另外，除了官网保护的 Vue 版本和微信小程序版本，Vant 也有由社区的小伙伴们发动和保护的 React 版本和支付宝小程序版本，欢送大家一起参加建设 ????
不平庸的 2020 年行将过来，心愿 Vant 能给大家的工作带来一点点的帮忙，咱们明年再会。
