推薦15個超贊的Vue開源項目
大家好，我是Echa。
隨著社會的不斷進步，科技不斷的發(fā)展。前端技術(shù)不斷的流行，Vue在國內(nèi)幾乎是家喻戶曉，前端程序員無人不知框架之一，其次就是React和Angular。
在前端圈內(nèi)人士經(jīng)常私信小編說，怎么快速學習Vue、React和Angular框架來開發(fā)項目呢？
其實關(guān)于這個話題小編之前有詳細的講過，請見這篇：推薦10個yyds的Vue 、React源碼解析開源項目 有詳細的學習方法，有興趣的粉絲們可以看看。
今天小編繼續(xù)推薦15個超贊的Vue開源項目，希望對粉絲們學習有所幫助，其次接私活也能養(yǎng)家糊口。
全文大綱
- Habitica - 是習慣養(yǎng)成及生產(chǎn)力應(yīng)用，讓你 “游戲人生”
- Reader - 是一個前端基于 Vue.js + Element 的閱讀工具
- Eplee - 是一款基于 Vue + Electron 的 ePub 閱讀器
- MarkText - 是一個基于 Vue + Electron 的簡單而優(yōu)雅的開源 markdown 編輯器
- JeecgBoot-Vue3版前端源碼，采用 Vue3.0+TypeScript+Vite+Ant-Design-Vue等新技術(shù)方案
- Chatwoot -是一個開源、自托管的用于即時消息渠道的客戶支持工具
- filebrowser -是一個使用 Go + Vue 編寫的工具
- Slidev -是基于 Web 的幻燈片制作和演示工具
- Hoppscotch - 是一種可以通過 Web 服務(wù)的方式構(gòu)建 API 訪問的工具
- Wiki.js- 是一款基于 Node.js + Vue 技術(shù)棧的強大、可高度擴展、開源的 Wiki 系統(tǒng)。
- Vue Material -提供超過56個組件來構(gòu)建不同類型的布局。
- Koel-是一款個人音樂流媒體服務(wù)，您可以根據(jù)自己的需求進行定制。
- Quasar-是一個通用的Vue框架，允許您為具有相同代碼庫的不同平臺編寫應(yīng)用程序
- Bootstrap Vue 是一個基于引導程序庫的UI工具庫。
- VeeValidate-是Vue.js的一個基于模板的驗證框架，允許您驗證輸入和顯示錯誤。
Habitica
Github：https://github.com/HabitRPG/habitica
Habitica 是習慣養(yǎng)成及生產(chǎn)力應(yīng)用，讓你 “游戲人生”。游戲里的獎懲措施能激勵你完成任務(wù)。Habitica 能夠幫助你達成目標，變得健康，勤奮，快樂。Habitica 可以讓你如角色扮演游戲般對待你的目標，對待你的生活。當你成功時升級，當你失敗時掉血，然后一直不斷地賺錢買武器和盔甲。Habitica 前端使用 Vue 編寫。
Reader
Github：https://github.com/hectorqin/reader
Reader 是一個前端基于 Vue.js + Element 的閱讀工具。其支持書架管理、搜索、書海、看書、換源、翻頁方式、手勢支持、自定義主題、自定義樣式、WebDAV同步、文字替換過濾、聽書、用戶配置備份恢復、漫畫、音頻、書源失效檢測、導入本地TXT、EPUB、UMD格式的書籍、書籍分組、RSS訂閱、定時更新書架、并發(fā)搜書、本地書倉等功能。
Eplee
Github：https://github.com/Janglee123/eplee
Eplee 是一款基于 Vue + Electron 的 ePub 閱讀器，專注于通過簡單美觀的 UI 提供干凈、無干擾的閱讀體驗。
MarkText
Github：https://github.com/marktext/marktext
MarkText 是一個基于 Vue + Electron 的簡單而優(yōu)雅的開源 markdown 編輯器，專注于速度和可用性。
JEECG BOOT
Github：https://github.com/jeecgboot/jeecgboot-vue3
JeecgBoot—Vue3版前端源碼，采用 Vue3.0+TypeScript+Vite+Ant-Design-Vue等新技術(shù)方案，包括二次封裝組件、utils、hooks、動態(tài)菜單、權(quán)限校驗、按鈕級別權(quán)限控制等功能。是JeecgBoot低代碼平臺的vue3技術(shù)棧的全新UI版本。
Chatwoot
Github：https://github.com/chatwoot/chatwoot
Chatwoot 是一個開源、自托管的用于即時消息渠道的客戶支持工具，可以幫助企業(yè)提供客戶支持。它是 Intercom、Zendesk、Salesforce Service Cloud 等的開源替代品。Chatwoot 對發(fā)生在不同溝通渠道的對話提供了一個綜合視圖。Chatwoot 的前端使用 Vue 編寫。
特點
Chatwoot支持以下對話渠道：
- 網(wǎng)站：使用我們的實時聊天小部件與您的客戶交談，并使用我們的SDK來識別用戶并提供上下文支持。
- 臉書：連接你的臉書頁面，開始回復你頁面上的直接消息。
- Instagram：連接您的Instagram個人資料并開始回復直接消息。
- 推特：連接你的推特個人資料，回復直接消息或提到你的推文。
- Telegram：連接您的Telegram機器人，并直接從一個儀表板回復您的客戶。
- WhatsApp：連接你的WhatsApp商業(yè)賬戶，并在Chatwoot中管理對話。
- Line：連接您的Line帳戶并管理Chatwoot中的對話。
- 短信：連接您的Twilio短信帳戶，并在Chatwoot回復短信查詢。
- API通道：使用我們的API通道構(gòu)建自定義通信通道。
- 電子郵件：將您的所有電子郵件查詢轉(zhuǎn)發(fā)到Chatwoot，并在我們的集成儀表板中查看。
File browser
Github：https://github.com/filebrowser/filebrowser
filebrowser 是一個使用 Go + Vue 編寫的工具，用于在瀏覽器中對服務(wù)器上的文件進行管理?？梢允切薷奈募?，或者是添加刪除文件，甚至可以分享文件，是一個很棒的文件管理器，可以當成網(wǎng)盤使用。
Slidev
Github：https://github.com/slidevjs/slidev
Slidev 是基于 Web 的幻燈片制作和演示工具。它旨在讓開發(fā)者專注在 Markdown 中編寫內(nèi)容，同時擁有支持 HTML 和 Vue 組件的能力，并且能夠呈現(xiàn)像素級完美的布局，還在你的演講稿中內(nèi)置了互動的演示樣例。它使用了功能豐富的Markdown文件來生成精美的幻燈片，具有即時重載的體驗。它還擁有很多內(nèi)置的集成功能，如實時編碼、導出 PDF、演講錄制等。Slidev 基于 Vue 3 + Vite + VueUse 等技術(shù)實現(xiàn)。
Hoppscotch
Github：https://github.com/hoppscotch/hoppscotch
Hoppscotch 是一種可以通過 Web 服務(wù)的方式構(gòu)建 API 訪問的工具，使用 Node.js + Vue 開發(fā)，采用簡約的 UI 設(shè)計，能實時發(fā)送和獲取響應(yīng)值，它的的前身是 Postwoman。Hoppscotch 功能與 Postman 類似，不僅支持 HTTP/HTTPS ，而且還支持 WebSocket、Socket.io、EventSourcee、MQTT、GraphQL。
hoppscotch目前支持以下方法：
- GET -- 請求檢索資源信息
- HEAD -- 檢索與GET請求相同的響應(yīng)頭，但沒有響應(yīng)主體。
- POST -- 服務(wù)器在數(shù)據(jù)庫中創(chuàng)建一個新條目。
- PUT -- 更新現(xiàn)有資源
- DELETE -- 刪除資源或相關(guān)組件。
- CONNECT -- 建立一條通往目標資源識別的服務(wù)器的隧道。
- OPTIONS -- 描述目標資源的通信選項。
- TRACE -- 沿著通往目標資源的路徑執(zhí)行消息回環(huán)測試。
- PATCH -- 與PUT非常相似，但會對資源進行部分更新。
- <custom> -- 一些API使用自定義的請求方法，如LIST。鍵入你的自定義方法。
Wiki.js
Github：https://github.com/requarks/wiki
Wiki.js 是一款基于 Node.js + Vue 技術(shù)棧的強大、可高度擴展、開源的 Wiki 系統(tǒng)。其界面簡潔美觀、權(quán)限管理靈活，支持多種編輯器、多種用戶驗證方式、多種備份存儲方式、多種搜索引擎，支持國際化、自定義主題、流量分析等，適合做小團隊的知識庫，適合管理和閱讀，支持協(xié)同創(chuàng)作。
Vue Material
Github：https://github.com/vuematerial/vue-material
Vue Material 輕便，完全按照Google Material 設(shè)計規(guī)范建造。Vue Material提供超過56個組件來構(gòu)建不同類型的布局。它的一個偉大之處在于，材料設(shè)計框架有真正徹底的文檔。該框架非常輕，具有完全符合谷歌材料設(shè)計指南的全系列組件。這種設(shè)計適合每一個屏幕，并支持每一個現(xiàn)代瀏覽器。
路線圖、貢獻指南、良好的文檔和變更日志都在這里。對于喜歡UI項目的開發(fā)人員來說，這是一個不錯的選擇。
Koel
Github：https://github.com/koel/koel
Koel是一款個人音樂流媒體服務(wù)，您可以根據(jù)自己的需求進行定制?？蛻舳耸褂肰ue編寫，后端使用Laravel編寫。針對網(wǎng)絡(luò)開發(fā)人員，Koel采用了一些更現(xiàn)代的網(wǎng)絡(luò)技術(shù)——flexbox、音頻和拖放API等——來完成其工作。
該項目在Github上非常受歡迎，有52位貢獻者。不幸的是，沒有詳細的投稿指南，但作者在Github上寫道，在你提交任何內(nèi)容之前，你需要打開一個問題。還可以選擇通過Opencollective贊助該項目。
我們喜歡這個項目背后的想法，即制作一個由社區(qū)開發(fā)的流媒體服務(wù)。因此，如果你熱愛音樂并想發(fā)展你的Vue技能，這將是一個很好的選擇。
Quasar
Github：https://github.com/quasarframework/quasar
Quasar是一個通用的Vue框架，允許您為具有相同代碼庫的不同平臺編寫應(yīng)用程序：SPAs、PWA、SSR應(yīng)用程序、混合移動應(yīng)用程序或多平臺桌面應(yīng)用程序。Quasar有多達81個組件。
這里有一個很棒的文檔和一組龐大的組件，設(shè)計時考慮到了性能和響應(yīng)能力。Quasar默認集成了最佳實踐（HTML/CSS/JS縮小、緩存破壞、樹抖動、源映射、帶延遲加載的代碼拆分、ES6泄漏、代碼linting、可訪問性），因此您可以主要關(guān)注應(yīng)用程序的功能。它還提供了一個CLI工具，可以輕松地構(gòu)建新項目。
該框架有一個很棒的社區(qū)，支持聊天和論壇，顯然還有一個貢獻指南。此外，您可以通過向他們捐款來支持該工具。
Bootstrap Vue
Github：https://github.com/bootstrap-vue/bootstrap-vue
Bootstrap Vue是一個基于引導程序庫的UI工具包。它只是用Vue代碼替換了常規(guī)引導程序組件中的JavaScript。使用Bootstrap Vue，您可以使用Vue.js和世界上最流行的前端CSS庫Bootstrap v4在網(wǎng)絡(luò)上構(gòu)建響應(yīng)迅速、移動優(yōu)先且可訪問ARIA的項目。它還可以輕松地與Nuxt.js集成。
文檔內(nèi)容廣泛，加上Discord提供的強大社區(qū)支持，使其成為與某人一起啟動項目并為其做出貢獻的安全選擇。
VeeValidate
Github：https://github.com/logaretm/vee-validate
eeValidate是Vue.js的一個基于模板的驗證框架，允許您驗證輸入和顯示錯誤。
由于它是基于模板的，您只需要為每個輸入指定在值更改時應(yīng)該使用哪種驗證器。這些錯誤將在支持40多種語言環(huán)境的情況下自動生成。許多規(guī)則都是現(xiàn)成的。
特點：
- 基于模板的驗證，既熟悉又易于設(shè)置；
- i18n 40多個地區(qū)的支持和錯誤消息；
- 異步和自定義規(guī)則支持；
- 用鉛字書寫的；
- 沒有依賴關(guān)系。
- VeeValidate解決了表單驗證的主要痛點，并以最靈活的方式解決了這些痛點：
- 能夠為用戶打造復雜的用戶體驗；
- 大多數(shù)常見的驗證都是內(nèi)置的；
跨領(lǐng)域驗證；
- 實用程序，以增強您的窗體的可訪問性和樣式；
- 本地化是內(nèi)置于核心的。
- 該團隊歡迎每個人為項目做出貢獻，并提供了良好的文檔和貢獻指南。它也有幾個偉大的例子和偉大的社區(qū)。
最后
一臺電腦,一個鍵盤,盡情揮灑智慧的人生;幾行數(shù)字,幾個字母,認真編寫生活的美好;
一 個靈感,一段程序,推動科技進步,促進社會發(fā)展。
