【吐血整理】40+ Vue3 實用工具分享
1、Vue3 UI元件庫
UI元件庫是可以理解為是一個重複使用的介面設計元素的集合體 ，它是一個檔案庫。 UI元件庫在整個系統中扮演的是行為層面的對接，是團隊內部設計師和開發間的橫向共同作業，是保證產品輸出一致的規範基礎。（學習視訊分享：）
這裡整理了17個Vue3 UI元件庫，包含13個Web UI庫和4個 UI庫，閱讀文章《》即可獲取。
Web UI庫
ElementUI Plus：面向設計師和開發者的元件庫
Ant Design of Vue：Ant Design 的 Vue 實現，開發和服務於企業級後臺產品
BalmUI：基於谷歌的 Material Design設計的UI 元件庫
Naive UI：基於 Vue 3.0/TypeScript 的免費開源前端 UI 元件庫
arco.design：位元組跳動企業級產品設計系統，支援React和Vue雙版本
Quasar：一個完整的、以效能為中心的框架
。。。
移動UI庫
Vant：行動端元件庫
NutUI：京東風格的輕量級行動端 Vue 元件庫
Varlet：Material 風格行動端元件庫
nutui-bingo：京東基於 NutUI 的抽獎元件庫
2、Vue3實用開發工具
在之前的文章《》中，我們介紹了7個Vue3實用開發工具：
unplugin-vue-components：按需元件自動匯入外掛
vuex-persistedstate：Vuex持久化外掛
vuex-persist：支援 Typescript 的Vuex持久化外掛
@vueuse/gesture：手勢庫，使應用程式具有互動性
unplugin-auto-import
pinia-plugin-persistedstate：Pinia 資料持久化儲存
vue-termui.dev：一個基於 Vue.js 的終端 UI 框架
3、Vue3視覺化工具
在科技的頻頻更新下，視覺化開發工具成為了提升開發效率的有效工具。在之前的文章《》中，我們介紹了4個Vue3視覺化工具：
Pdfvuer：用於Vue應用中的一個PDF檢視器
vue3-marquee：無縫捲動元件
Vue-ECharts：百度ECharts 的 Vue.js 元件
iconpark：一個通過技術驅動向量圖示樣式的開源圖示庫
4、Vue3常用外掛
在之前的文章《》中，我們瞭解了10個有助於提高效率的vue外掛：
vue-multiselect-next：Vue的通用選擇/多選/標記元件
vue-print-nb：指令包裝器
vue-i18n-next：Vue3的國際化外掛
vue-cropper：vue圖片裁剪外掛
Vue Grid Layout：Vue的網格佈局系統
Vue Qrcode Reader：一組用於檢測和解碼QR(二維條碼)碼的Vue.js元件
Makeit Captcha：滾軸驗證碼外掛
vue3-clipboard：基於Vue3的貼上覆制外掛
vue.draggable 基於Sortable.js的Vue 3拖放元件
BetterScroll解決行動端（已支援 PC）各種捲動場景需求的外掛
5、Vue3相關生態
在之前的文章《》中，我們瞭解了6個Vue3相關生態：
Vue外掛庫（vue365.cn）
Pinia：輕量級狀態管理庫
Nuxt Modules
Nuxt 3：可用來建立伺服器端渲染 (SSR) 應用
vuepress：Vue驅動的靜態網站生成器
VueUse：基本 Vue 組合實用函數的集合
6、Vue3動畫外掛
1）vue-starport
帶有動畫的跨路由共用元件
github地址：https://github.com/antfu/vue-starport/blob/main/README.zh-Hans.md
演示地址：https://vue-starport.netlify.app/
前端（vue）入門到精通課程：進入學習
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API偵錯工具：
2）@vueuse/motion
Vue Composables 讓你的元件動起來
官方地址：https://motion.vueuse.org/
github地址：https://github.com/vueuse/motion
7、音視訊元件
@vueuse/sound
用於播放音效的 Vue 組合
官方地址：https://sound.vueuse.org/
github地址：https://github.com/VueUse/sound
【相關視訊教學推薦：、】
