推薦 20 個近期比較「火熱」的Vue項目(值得收藏)
這篇文章跟大家分享20 個近期比較「火熱」的Vue專案給前端工友,收藏等於學會,希望對大家有幫助。
我們知道,現在在面試時,如果在github
或其他開源網站上貢獻過開源項目,往往能加分不少
我最近也比較關注Vue
相關的開源項目,收集了一些最近還算比較「火熱」的Vue項目,也給大家推薦推薦,快一起來看看吧! 【相關推薦:vue.js教學】
註:排名不分先後
1. vue-admin-better
目前Stars
:11066
本月斬獲Stars
:300
是一個後台管理系統,開源版本支援免費商用,有40
多個單頁,RBAC
模型JWT
權限控制,良好的類型定義,跨平台PC
、手機端、平板,後端路由動態渲染
元件庫,Vue2
使用的是element-ui
,Vue3
有使用element-plus
和ant-design-vue
,適合正在以及想使用Vue element-ui/element-plus/ant-design-vue 開發的伙伴
GitHub
網址:https://github.com/chuzhixin/vue-admin-better
2. element-plus
目前Stars
:13178
本月獲擊Stars
:505
一個Vue3
的UI
#元件庫;知道Vue
的應該都是知道element
,element-plus
就是element
的Vue3
版本
如果你對TS
和Vue3
有興趣,記得去看看喔
GitHub地址:https://github.com/element-plus/element-plus
文件地址:https:// element-plus.gitee.io/zh-CN/
#3. ant-design-vue
##目前Stars:
15818
Stars:
224
ant- design-vue和
element-plus一樣,算是比較知名的比較老的元件庫一直延續下來的,也是尤雨溪多次推薦的元件庫之一,它是
Ant Design 的
Vue 實現,元件的風格與
Ant Design 保持同步,元件的
html 結構和
css 樣式也保持一致,真正做到了樣式
0 修改,元件
API 也盡量保持了一致,支援服務端渲染
GitHub位址:https:// github.com/vueComponent/ant-design-vue/
#文件網址:https://next.antdv.com/docs/vue/ introduce-cn/
4. naive-ui-admin
目前Stars:
1421
Stars:
360
vue-admin-better#,
naive-ui-admin是一個基於
vue3
vite2
TS 的中後台解決方案,它使用了最新的前端技術棧,並且提煉了典型的商業模型,頁面,包括二次封裝元件、動態選單、權限校驗、粒子化權限控制等功能,它可以幫助你快速建立企業級中後台項目
vue3、
vite2和
TS最新技術感興趣,可以去試試
GitHub地址:https://github.com/jekip/naive-ui-admin預覽網址:https://naive-ui-admin.vercel.app/
5. eladmin-web
#目前Stars:
3445
Stars:
82
#eladmin的前端源碼,該專案基於
Spring Boot 2.1. 0 、
Spring Boot Jpa、 Spring
Security、
Redis、
Vue的前後端分離後台管理系統, 權限控制採用
RBAC,選單動態路由
eladmin
專案的官方文件位址:https://el-admin.vip/
6. element
目前Stars
:51464
本月獲擊Stars
:229
不用多說,一個Vue2
知名的UI
元件庫
GitHub網址:https://github.com /ElemeFE/element
官方文件:https://element.eleme.cn/#/zh-CN
##7 . homer
目前Stars:
3594
Stars:
329
yaml 設定檔就能實現
GitHub位址:https://github.com /bastienwirtz/homer
#8. uView2.0
目前Stars#:
233
Stars:
142
uView2.0是多平台快速開發的
UI框架,全面相容
nvue,原生渲染,相容於安卓、
iOS、微信小程式、
H5、
QQ小程式、百度小程式、支付寶小程式、頭條小程式
GitHub網址:https://github.com/umicro/uView2.0官方文件: https://uviewui.com
9. vue-vben-admin##目前
Stars:8200
本月被斬獲
:513
官方以快著稱,其實就是基於
vite2
TS
# #10. vue3-composition-admin
目前Stars
:1063本月斬獲
Stars
93vue3-composition-admin
vue3,
ts和
element-plus,專案都是以
composition api風格編寫
想了解
Vue3 composition api
GitHub網址:https://github.com/RainManGO/vue3-composition-admin
線上demo示範網址:https://admin-tmpl-test.rencaiyoujia .cn/
11. vue-element-admin
目前Stars
:73242本月斬獲
Stars
755上一個項目
vue3-composition-admin
vue-element-admin專案實作
GitHub位址:https://github.com/PanJiaChen/vue-element-admin
在線demo示範網址:https://panjiachen.github.io/vue-element-admin/#/dashboard
##12. vue3-antd- admin
目前Stars:
1166本月斬獲
Stars
:
是一個基於
vue-cli5.x
/
vue3.x
ant-design-vue3.x
typescript hooks
的基礎後台管理系統範本RBAC
的權限系統, JSON Schema
動態表單,動態表格,漂亮鎖定畫面介面# GitHub網址:https://github.com/buqiyuan/vue3-antd-admin
#13. form-generator
#目前Stars:
5585一個Element UI
表單設計及程式碼產生器,可將產生的程式碼直接運行在基於Element
的vue
專案中;也可匯出JSON
表單,使用配套的解析器將JSON
#解析成真實的表單
GitHub位址:https://github.com/JakHuang/form- generator
預覽網址:https://mrhj.gitee.io/form-generator/#/
##14. varlet
目前Stars:
1682
Stars:
298
Vue3的
Material design風格行動端元件庫,尤雨溪提到過
GitHub網址:https://github.com/haoziqaq/varlet文件網址:https://varlet.gitee.io/varlet-ui/#/zh- CN/home
15. sub-web
目前Stars:
1670
Stars:
141
vue-cli與
tindy2013/ subconverter後端實現的設定自動產生
GitHub位址:https://github.com/CareyWang/sub-web展示位址:https://sub -web.netlify.app/
16. vue2-manage
目前Stars :
11375
Stars:
103
GitHub位址: https://github.com/bailicangdu/vue2-manage展示網址:https://cangdu.org/manage/#/
17. vue-pure-admin
目前Stars:
1675
Stars :
194
vue-pure-admin 是一個免費開源的中後台模版,使用了最新的
vue3 vite2 Element-Plus TypeScript 等主流技術開發,開箱即用的中後台前端解決方案,附有配套視頻、文檔和UI設計
GitHub地址:https://github.com/xiaoxian521/ vue-pure-admin預覽網址:http://yiming_chang.gitee.io/manages
目前
Stars:1492
本月獲頒##Stars
64
是
Vue3
GitHub網址:https://github.com/vuejs/docs
官網:https: //v3.vuejs.org/
#19. PicGo
目前Stars
:15480本月斬獲
Stars
422一個用於快速上傳圖片並取得圖片
URL
GitHub網址:https://github.com/Molunerfinn/PicGo
文件網址:https://picgo. github.io/PicGo-Doc/zh/guide/
#官網:https://molunerfinn.com/PicGo/
20. daisyui
#目前Stars
:6913
本月斬獲
Stars:
518#daisyUI
可能比較陌生,它是
Tailwind CSS
Components,
Tailwind CSS實際上是一個透過以
token list語法(
HTML class###)承載的### DSL###,用來書寫等價於###CSS/Sass/Less### 的樣式宣告#########GitHub位址:https://github.com/saadeghi/daisyui#######文件位址:https ://daisyui.com/######官網網址:https://daisyui.com/###
THE END
更多程式相關知識,請造訪:程式設計影片! !
以上是推薦 20 個近期比較「火熱」的Vue項目(值得收藏)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

在 Vue.js 中使用 Bootstrap 分為五個步驟:安裝 Bootstrap。在 main.js 中導入 Bootstrap。直接在模板中使用 Bootstrap 組件。可選:自定義樣式。可選:使用插件。

可以通過以下步驟為 Vue 按鈕添加函數:將 HTML 模板中的按鈕綁定到一個方法。在 Vue 實例中定義該方法並編寫函數邏輯。

Vue.js 中的 watch 選項允許開發者監聽特定數據的變化。當數據發生變化時,watch 會觸發一個回調函數,用於執行更新視圖或其他任務。其配置選項包括 immediate,用於指定是否立即執行回調,以及 deep,用於指定是否遞歸監聽對像或數組的更改。

Vue 多頁面開發是一種使用 Vue.js 框架構建應用程序的方法,其中應用程序被劃分為獨立的頁面:代碼維護性:將應用程序拆分為多個頁面可以使代碼更易於管理和維護。模塊化:每個頁面都可以作為獨立的模塊,便於重用和替換。路由簡單:頁面之間的導航可以通過簡單的路由配置來管理。 SEO 優化:每個頁面都有自己的 URL,這有助於搜索引擎優化。

Vue.js 返回上一頁有四種方法:$router.go(-1)$router.back()使用 <router-link to="/"> 組件window.history.back(),方法選擇取決於場景。

在 Vue.js 中引用 JS 文件的方法有三種:直接使用 <script> 標籤指定路徑;利用 mounted() 生命週期鉤子動態導入;通過 Vuex 狀態管理庫進行導入。

Vue.js 遍歷數組和對像有三種常見方法:v-for 指令用於遍歷每個元素並渲染模板;v-bind 指令可與 v-for 一起使用,為每個元素動態設置屬性值;.map 方法可將數組元素轉換為新數組。

Vue 中 div 元素跳轉的方法有兩種:使用 Vue Router,添加 router-link 組件。添加 @click 事件監聽器,調用 this.$router.push() 方法跳轉。
