尤雨溪连发两条推特墙裂推荐的这些库你一定要知道!

就在昨天，尤雨溪发了两条推特说明了 vue 生态的完整性和本身的独特性！

今天我们仔细看看这些库都是干嘛的！

第一条推特：React 有的我都有！

Framer Motion 的 Vue 替代品：Motion for Vue

Framer Motion 是 React 生态中非常流行的动画库，它提供了简单易用的 API 来实现复杂的动画效果。而在 Vue 生态中，Motion for Vue 是一个与之相当的替代品。它同样提供了强大的动画功能，支持手势、拖拽、过渡等效果，并且与 Vue 的响应式系统无缝集成。通过 Motion for Vue，开发者可以轻松地为 Vue 应用添加流畅的动画体验。

• 官网: motion.dev

微信限制降低了帧数

微信限制降低了帧数

Radix UI 的 Vue 替代品：Reka UI

Radix UI 是 React 生态中的一个低级别 UI 组件库，专注于提供无样式的、可访问性良好的基础组件。在 Vue 生态中，Reka UI 提供了类似的功能。它允许开发者基于这些基础组件构建自定义的 UI，同时确保组件的可访问性和灵活性。Reka UI 的设计理念与 Radix UI 非常相似，适合那些希望在 Vue 中构建高度定制化 UI 的开发者。

• 官网: reka-ui.com

Shadcn 的 Vue 替代品：Shadcn-vue

Shadcn 是 React 生态中的一个 UI 组件库，以其现代化的设计和丰富的组件著称。在 Vue 生态中，Shadcn-vue 提供了类似的组件库，帮助开发者快速构建美观且功能丰富的用户界面。Shadcn-vue 的组件设计风格现代，支持主题定制，非常适合需要快速搭建前端界面的项目。

• 官网: shadcn-vue.com

React Three Fiber 的 Vue 替代品：TresJS

React Three Fiber 是 React 生态中用于构建 3D 场景的库，基于 Three.js 封装，提供了声明式的 API。在 Vue 生态中，TresJS 是一个与之相当的库。TresJS 允许开发者在 Vue 中使用 Three.js 来创建复杂的 3D 场景，并且与 Vue 的响应式系统无缝集成。通过 TresJS，开发者可以轻松地在 Vue 应用中实现 3D 效果。

• 官网: tresjs.org

Aceternity UI / Magic UI 的 Vue 替代品：Inspira UI

Aceternity UI 和 Magic UI 是 React 生态中用于构建炫酷 UI 效果的库，提供了丰富的动画和交互组件。在 Vue 生态中，Inspira UI 提供了类似的功能。Inspira UI 提供了大量的预构建组件和动画效果，帮助开发者快速实现吸引眼球的用户界面。无论是背景动画、按钮效果还是复杂的交互，Inspira UI 都能轻松应对。

• 官网: inspira-ui.com

React Query 的 Vue 替代品：TanStack Query（Vue 支持）

React Query 是 React 生态中用于数据获取和状态管理的库，提供了强大的缓存、同步和状态管理功能。现在，TanStack Query 已经支持 Vue，开发者可以在 Vue 中使用与 React Query 相同的 API 来管理数据。TanStack Query 提供了高效的数据获取和缓存机制，非常适合需要处理复杂数据流的应用。

• 官网: tanstack.com/query

第二条推特：Vue 生态中的独特优势

除了上述与 React 生态对应的库之外，Vue 生态还有许多独特的优势，这些工具和库为开发者提供了极大的便利：

官方路由和状态管理：Vue Router 和 Pinia

Vue 官方提供了 Vue Router 和 Pinia 作为路由和状态管理的解决方案。Vue Router 是 Vue 生态中最常用的路由库，提供了强大的路由功能，支持嵌套路由、动态路由等。而 Pinia 是 Vue 官方推荐的状态管理库，相比 Vuex，Pinia 更加轻量且易于使用，提供了更好的 TypeScript 支持。

• Vue Router: router.vuejs.org
• Pinia: pinia.vuejs.org

成熟的 UI 组件库

Vue 生态中有许多成熟的 UI 组件库，如 Element Plus、Vuetify、Ant Design Vue 等。这些组件库提供了丰富的 UI 组件，帮助开发者快速构建美观且功能强大的用户界面。

• UI 组件库列表: ui-libs.vercel.app

强大的工具库：VueUse

VueUse 是 Vue 生态中的一个实用工具库，提供了大量的 Composition API 工具函数，涵盖了状态管理、动画、网络请求、DOM 操作等多个方面。VueUse 的 API 设计简洁且功能强大，极大地提高了开发效率。

• 官网: vueuse.org

优秀的表单库：Formkit 和 VueForm

在表单处理方面，Vue 生态中有 Formkit 和 VueForm 等优秀的表单库。这些库提供了强大的表单验证、动态表单生成、表单状态管理等功能，帮助开发者轻松处理复杂的表单逻辑。

• Formkit: formkit.com
• VueForm: vueform.com

结语

Vue 生态的持续发展离不开社区的支持和贡献，未来我们期待看到更多优秀的库和工具涌现，进一步丰富 Vue 的生态系统。

也希望这些库真的可以帮助到更多的开发者！