一個新的 Vue3 元件庫，使用簡單，配置靈活，作者是一個個人開發者，值得關注。

關於 Fighting Design

Fighting Design

是一款靈活、優質的前端

元件庫

，基於當前流行的 Vue3 +

TypeScript

+

Vite

開發，方便開發者在 Vue3 專案中快速整合。和絕大多數開源的元件庫不同，這個專案主要由來自杭州的開發者

田同學

開發和維護，在最新的一期

阮一峰

科技週刊中還被推薦了，廣受關注。

Fighting Design 官網

Fighting Design 的技術特性

使用

Vue3

最新特性開發

全面基於

Vite

，速度夠快

沒有第三方依賴，夠純粹

提供不同打包模式，相容不同專案

支援完整引入和

按需引入

，減少打包體積

使用

TypeScript

+ Template 編寫，嚴格的

TypeScript

型別，全域性無 any 型別

完善的單元測試

Fighting Design 開發上手體驗

Fighting Design 目前提供了數十個前端開發常用的基礎元件，UI 設計顏值線上，設計風格中性耐看，也擁有詳細的使用文件，上手使用很簡單。

Fighting Design 元件預覽

支援 pnpm、npm 和 yarn 三種方式安裝：

// npm 安裝npm install ——save-dev fighting-design// pnpm 安裝pnpm add ——save-dev fighting-design// yarn 安裝yarn add ——save-dev fighting-design

如果不是工程化專案，也支援像

Vue

一樣，直接在 html 引入 js 的方式使用：

Fighting Design 每一個元件都有程式碼示例，文件編寫得也很好，使用非常簡單。

骨架屏

、水印、

日曆

這幾個元件做得很不錯，很實用。

Fighting Design 日曆元件

不過目前的元件都很基礎，像表格這種相對複雜的元件還沒有，目前也還只是

Beta 版本

，不過作者很勤奮，目前這個階段程式碼提交很頻繁，一直在更新，從今年4月份首次提交至今，已經初具規模。作者在官網呼籲更多開發者參與維護，如果你也有意願參與，可以聯絡作者加入，門檻不高。

免費開源說明

Fighting Design

是一個由個人開發者打造的 Vue3 UI 元件庫，整個專案基於 MIT 開源協議，任何個人和公司都可以免費下載使用，自2022年4月首次提交程式碼以來，目前已經有超過 200 star 了，非常值得關注。

由於

Fighting Design

目前還不是正式版本，不建議用來作為生產專案使用，建議作為學習提高使用。

關注我，持續分享高質量的免費開源、免費商用的資源。

↓↓點選檢視本次分享的網址。

Fighting Design - 由個人開發的 Vue3 前端元件庫，上手使用簡單、靈活｜那些免費的磚