經(jīng)過(guò)多年的不斷演進(jìn)，Vue 已經(jīng)構(gòu)建了一個(gè)極為豐富且強(qiáng)大的生態(tài)系統(tǒng)，今天就來(lái)盤(pán)點(diǎn) Vue 官方生態(tài)系統(tǒng)中那些好用的工具！

框架

Vue 有兩個(gè)主要的代碼倉(cāng)庫(kù)：

• Vue 2：

介紹：目前已經(jīng)停止維護(hù)。

Github：https://github.com/vuejs/vue

• Vue 3：
• 介紹：官方推薦并且在積極維護(hù)更新的默認(rèn)的 Vue 版本。
• Github：https://github.com/vuejs/core

除此之外，還有即將推出的無(wú)虛擬 DOM 版 Vue 3 的倉(cāng)庫(kù)：https://github.com/vuejs/core-vapor

腳手架

Vue 官方生態(tài)中有兩個(gè)腳手架：

• vue-cli：

介紹：基于 Webpack 的 Vue 項(xiàng)目腳手架，目前處于維護(hù)狀態(tài)，不在積極更新；

Github：https://github.com/vuejs/vue-cli

• create-vue：
• 介紹：基于 Vite 的 Vue 項(xiàng)目腳手架，同時(shí)支持 Vue 2 和 Vue 3，它是 Vue 官方推薦的 Vue 腳手架。
• Github：https://github.com/vuejs/create-vue
• 狀態(tài)管理

Vue 官方生態(tài)中有兩個(gè)狀態(tài)管理工具：

• Pinia：

介紹：官方推薦的直觀、類(lèi)型安全且靈活的 Vue 狀態(tài)管理工具，支持在 Vue 2 和 Vue 3 中使用，比 Vuex 更輕量；

Github：https://github.com/vuejs/pinia

• Vuex：
• 介紹：老牌 Vue 狀態(tài)管理工具，目前處于維護(hù)狀態(tài)，不會(huì)在新增功能
• Github：https://github.com/vuejs/vuex

路由

Vue 的官方路由器是 Vue Router，有兩個(gè)代碼倉(cāng)庫(kù)：

• vue-router：

介紹：vue-router 3 的代碼倉(cāng)庫(kù)，僅適用于 Vue 2.0。

Github：https://github.com/vuejs/vue-router

• router：
• 介紹：vue-router 4 的代碼倉(cāng)庫(kù)，適用于 Vue 3。
• Github：https://github.com/vuejs/router

構(gòu)建

Vue 官方生態(tài)中有兩個(gè)構(gòu)建工具：

• Vite：

介紹：Vue 官方推薦的下一代前端構(gòu)建工具。

Github：https://github.com/vitejs/vite

• Rolldown：
• 介紹：基于 Rust 的快速打包器，兼容 Rollup 的 API，目前處于積極開(kāi)發(fā)中，尚未用于生產(chǎn)，后續(xù)會(huì)作為 Vite 的底層工具以及單獨(dú)的打包器來(lái)使用。
• Github：https://github.com/rolldown/rolldown

開(kāi)發(fā)&調(diào)試

Vue 官方生態(tài)中的開(kāi)發(fā)和調(diào)試工具包括：

• Vue - Official：Vue 的官方 VS Code 插件，原名為 Volar，于近期改名。
• Vue DevTools：旨在增強(qiáng) Vue 開(kāi)發(fā)人員體驗(yàn)的工具，可以通過(guò) Vite 插件、瀏覽器擴(kuò)展、獨(dú)立應(yīng)用的形式來(lái)使用。
• eslint-plugin-vue：Vue.js 的官方 ESLint 插件。

測(cè)試

Vitest 是 Vue 官方測(cè)試工具，它是由 Vite 提供支持的下一代測(cè)試框架。

Github：https://github.com/vitest-dev/vitest

集成

• vuefire：

介紹：Vue.js 的 Firebase 綁定，適用于 Vue >=2.7 和 Vue 3。

Github：https://github.com/vuejs/vuefire

• apollo：
• 介紹：VueJS 的 Apollo/GraphQL 集成
• Github：https://github.com/vuejs/apollo

靜態(tài)站點(diǎn)生成器

Vue 官方生態(tài)中有兩個(gè)靜態(tài)站點(diǎn)生成器:

• VuePress：

介紹：https://github.com/vuejs/vuepress

Github：簡(jiǎn)約 Vue 驅(qū)動(dòng)的靜態(tài)站點(diǎn)生成器，目前處于維護(hù)狀態(tài)

• VitePress：
• 介紹：構(gòu)建在 Vue 3 + Vite 之上的下一代基于 Vue 的靜態(tài)站點(diǎn)生成器，專(zhuān)為構(gòu)建快速、以?xún)?nèi)容為中心的網(wǎng)站而設(shè)計(jì)。
• Github：https://github.com/vuejs/vitepress

元框架

Nuxt 不是 Vue 團(tuán)隊(duì)開(kāi)發(fā)的，但也是基于 Vue 的唯一元框架了，其目標(biāo)是以直觀且可擴(kuò)展的方式使用 Vue.js 創(chuàng)建類(lèi)型安全、高性能和生產(chǎn)級(jí)的全棧 Web 應(yīng)用和網(wǎng)站。

Github：https://github.com/nuxt/nuxt

實(shí)用工具

Vueuse 團(tuán)隊(duì)成員 Antfu 開(kāi)發(fā)的基于 Composition API 的實(shí)用函數(shù)集合，適用于 Vue 3 和 Vue 2，包含 200+ 實(shí)用函數(shù)（類(lèi)似于Hooks）。

Github：https://github.com/vueuse/vueuse

Awesome

Awesome Vue 是與 Vue.js 相關(guān)的精彩內(nèi)容的精選列表。

Github：https://github.com/vuejs/awesome-vue