譯文：Vue超全終極資源，值得收藏！

時間：2023-06-07 02:36:01 | 來源：網(wǎng)站運營

時間：2023-06-07 02:36:01 來源：網(wǎng)站運營

譯文：Vue超全終極資源，值得收藏！：原文鏈接：https://dev.to/theme_selection/ultimate-vuejs-resources-for-developers-3bbk

如有翻譯不準(zhǔn)，請多指正。

眾所周知，Vue是最好的JavaScript框架之一。它受到全球開發(fā)人員的強烈推薦。在這里，我們將列出VueJS的一些終極資源。不過，在我們開始列出之前，讓我們先來看一下VueJS 的概述。

什么是VueJS？

Vue是一個用于構(gòu)建用戶界面的漸進(jìn)式框架。它是從頭開始設(shè)計的，可以很容易地成為一個庫和一個框架，這取決于你想達(dá)到目標(biāo)。它由一個專注于視圖層的核心庫和支持庫的生態(tài)系統(tǒng)組成。Vue是由尤雨溪創(chuàng)建的。他創(chuàng)建了Vue作為一個漸進(jìn)式JavaScript框架和Angular的高性能替代品。

與Angular和React不同，VueJS沒有得到Facebook和Google等科技巨頭的支持。然而，VueJS由于其驚人的功能和優(yōu)勢而成為最受歡迎的js框架。最近，它的GitHub（約181k星）和npm注冊表（約1，925，903次每周下載）已經(jīng)與React和Angular相媲美。

此外，它被Gitlab，阿里巴巴，小米，Adobe，Euronews，Nintendo，Grammarly，Codeship，Behance等大公司使用。

如果你正在使用VueJS，那么你可能需要 BestVue Editor來加快開發(fā)速度。另外，如果你需要基于VueJS的管理模板，請檢查MaterioVuetify VueJS管理模板是否可以成為啟動項目的好資源。

現(xiàn)在，讓我們開始吧。

以下是一些有用的VueJS資源，這些資源涉及有關(guān)VueJS的組件庫，示例，項目，工具和文章。

UI庫和框架

UI 組件庫是一組（通常）可靠的現(xiàn)成 UI 組件，如按鈕、輸入、對話框等。它們用作布局的構(gòu)建基塊。由于其模塊化特性，我們可以以許多不同的方式排列組件，以實現(xiàn)獨特的效果。

BootstrapVue

Bootstrap vue 將 Bootstrap 組件與Vue結(jié)合使用。它可以幫助你構(gòu)建響應(yīng)迅速、移動優(yōu)先的項目。它是Vue.js和世界上最受歡迎的前端CSS庫Bootstrap的組合。BootstrapVue將 Bootstrap的強大功能帶到了Vue。它使所有Bootstrap 元素（如行、列和卡）都可以用作Vue 組件。

此外，它還提供了適用于Vue .js v2.6 的Bootstrap v4 組件和網(wǎng)格系統(tǒng)的最全面的實現(xiàn)之一，并帶有廣泛且自動化的WAI-ARIA 輔助功能標(biāo)記。

特征：

• 易于主題化
• 開箱即用的 ARIA 輔助功能
• 未綁定到 jQuery

你還可以查看Vuexy VueJS管理模板以獲取更好的想法。它基于bootstrapVue。此外，它是一個可高度定制，高級，最受客戶喜愛的多用途管理模板。

Vuexy提供了一些非常驚人且引人注目的功能：

• 多語言
• 支持RTL
• 添加了 Figma 和 Sketch文件

Vuetify

Vuetify是一個VueUI庫，其中包含使用MaterialDesign規(guī)范的精美手工制作的組件。它由形狀、卡片、交互、深度效果（如陰影和燈光等）的UI 指南組成。

它可以幫助你使用成功所需的所有工具來加快開發(fā)過程。此外，它支持所有現(xiàn)代瀏覽器，并與VueCLI-3兼容。它還為Simple HTML，Webpack，NUXT，PWA，Electron，ALa Carte，ApacheCordova提供了基本模板。

產(chǎn)品特點：

• WCAG可訪問性（a11y） / WCAG / Section 508 / RTL 支持
• 30 多種支持的語言
• 更小的捆綁尺寸，具有自動搖樹功能
• 一個龐大的Discord社區(qū)
• 對主要版本的長達(dá)18 個月的支持

你可以查看MaterioVuetify VueJS AdminTemplate以獲得更好的想法。Materio還提供了寶貴的功能，旨在幫助創(chuàng)建完全符合你想象的優(yōu)質(zhì)單頁應(yīng)用程序。

此外，MaterioVuetify VueJS AdminTemplate還附帶了獨特而有用的工具，例如模糊搜索，Dark，Semi-Dark和Bordered布局選項，AdvancedCards和Chart。此外，它還提供了以下驚人功能。

特征：

• Pure Vue JS， 無jQuery依賴性
• 使用 Vue CLI 創(chuàng)建
• 利用 Vuex、Vue Router、Webpack
• 代碼拆分，延遲加載
• JWT身份認(rèn)證
• 訪問控制 （ACL）
• 支持RTL

Quasar

Quasar是一個高性能的MaterialDesign組件套件，具有SPA，SSR，PWA，Mobile（Cordova和Compacter），Desktop（Electron）和瀏覽器擴展的構(gòu)建器。這使你作為Web開發(fā)人員可以快速創(chuàng)建多種風(fēng)格的響應(yīng)式網(wǎng)站/應(yīng)用程序。它專注于遵循材料2.0。

Quasar提供了一個UMD（統(tǒng)一模塊定義）版本，你可以將其作為CSS和JSHTML標(biāo)簽添加到現(xiàn)有項目中，然后就可以使用它了。

特征：

• 以性能為中心的框架
• 提供內(nèi)置 SSR（服務(wù)器端渲染應(yīng)用）支持
• PWA（漸進(jìn)式 Web 應(yīng)用程序）
• BEX（瀏覽器擴展）
• 通過Cordova或Compacter的移動應(yīng)用程序（Android，iOS等）
• 多平臺桌面應(yīng)用程序（使用 Electron）

Vuesax

Vuesax是一個基于Vuejs的組件框架，它是一個從頭開始設(shè)計為可增量采用的框架。它提供了獨特且可重用的UI組件。該框架的重點是促進(jìn)應(yīng)用程序的開發(fā)，在不刪除必要功能的情況下改進(jìn)其設(shè)計。此外，所有組件都具有獨特的顏色，形狀和設(shè)計，因此你可以自由使用它們而不會失去創(chuàng)建和生產(chǎn)的速度。

特征：

• 獨特而美麗的設(shè)計
• 新穎的設(shè)計與眾所周知的材料設(shè)計相比
• 可重復(fù)使用的組件，易于實施
• 響應(yīng)式支持

Nuxt.js

Nuxt是一個基于Vue的漸進(jìn)式框架.js來創(chuàng)建現(xiàn)代Web應(yīng)用程序。它基于Vue.js官方庫（vue，vue-router和Vuex）和強大的開發(fā)工具（Webpack，Babel和PostCSS）。

特征

• 自動轉(zhuǎn)譯和捆綁（使用 Webpack 和 babel）
• 熱代碼重新加載
• 服務(wù)器端呈現(xiàn)或單頁應(yīng)用程序或靜態(tài)生成，你可以根據(jù)自身選擇

Ream

Ream是一個用于在Vue3中構(gòu)建服務(wù)器渲染或靜態(tài)生成的Web應(yīng)用程序的框架，它受到Next.js和SvelteKit的啟發(fā)。

開源項目

Pagekit

模塊化輕量級CMS由Symfony組件和Vue.js構(gòu)建而成。無論是個人博客還是公司的網(wǎng)站。使用Pagekit，可以為網(wǎng)絡(luò)創(chuàng)建功能強大的內(nèi)容，這些內(nèi)容可以在每臺設(shè)備上完美運行。Pagekit干凈直觀的界面使您可以專注于最重要的事情，管理你的內(nèi)容。

Koel

Koel是一個簡單的基于Web的個人音頻流媒體服務(wù)，在客戶端用Vue編寫，在服務(wù)器端用Laravel編寫。針對Web開發(fā)人員，Koel采用了一些更現(xiàn)代的Web技術(shù)- CSS網(wǎng)格，音頻和拖放API等來完成它的工作。

Flox

Flox是一個自托管的電影，系列和Amines觀看列表。它建立在Laravel和Vue之上.js并使用電影數(shù)據(jù)庫API。該評級基于3分制：goodmedium bad

特征

• 用于Plex的API - 將Plex的電影，節(jié)目和觀看的劇集從Plex同步到Flox。
• 劇集跟蹤。
• 建議。
• 監(jiān)視列表。
• 熱門電影和節(jié)目，即將上映和當(dāng)前電影（每日更新）。

Vuegg

VueJS項目通過將組件直接拖放到可視化編輯器中，并移動、調(diào)整它們的大小到你的選擇。Vuegg利用應(yīng)用程序/網(wǎng)站的頁面和路由的創(chuàng)建，簡化了樣式設(shè)計工作，并有助于實現(xiàn)快速原型制作工作流程。

該項目的目的是將設(shè)計和原型設(shè)計合并到一個單一的流程中。每當(dāng)你對屏幕上看到的內(nèi)容感到滿意時，只需獲取代碼即可。

特征：

• 通過拖放組件進(jìn)行模型/原型制作，并移動/調(diào)整它們的大小
• 支持標(biāo)準(zhǔn)鼠標(biāo)和鍵盤組合
• 響應(yīng)式預(yù)覽（手機、平板電腦、網(wǎng)絡(luò)）
• HTML5 元素的基本集合

VUE CRUD

VueCRUD允許創(chuàng)建用于管理單個表的機制，以及具有登錄系統(tǒng)和模塊的CMS或擴展CRM。VueCRUD使用vue及其生態(tài)系統(tǒng)（Vuex，Vuetify等）。享受世界上最流行的JS框架的好處。

商業(yè)項目

Materio– Vuetify VueJS Laravel Admin Template

MaterioVuetify VueJS Laravel Admin Template –是開發(fā)人員最友好且高度可定制的管理儀表板模板，基于流行的前端框架VueJS和后端Laravel。

如果你是一個開發(fā)人員，正在尋找最好的VueJS Laravel管理模板，那么這就是一個。此外，我們遵循最高的行業(yè)標(biāo)準(zhǔn)，為你帶來最好的laravel管理模板之一。此外，它不僅快速且易于使用，而且具有高度可擴展性。此外，提供極致的便利性和靈活性，你將能夠毫不費力地構(gòu)建所需的任何應(yīng)用程序。

此外，你可以使用此Vuejs laravel管理模板輕松構(gòu)建高質(zhì)量的單頁應(yīng)用程序。因此，請使用我們的創(chuàng)新管理模板創(chuàng)建引人注目，高質(zhì)量和高性能的單頁應(yīng)用程序。

特征：

• 純Vuejs，無jQuery依賴性
• 使用 Vue CLI 創(chuàng)建
• 利用 Vuex、Vue Router、Webpack
• 3 儀表板，RTL 支持
• 代碼拆分，延遲加載
• API 就緒 JWT 身份驗證流程
• 訪問控制（即使在 CRUD 操作上）
• Laravel passport
• Laravel sanctum等等

Vuexy - VueJS 管理模板

Vuexy -Vuejs Admin DashboardTemplate在所有bootstrapVue管理模板中都是高級的。此外，此模板響應(yīng)速度快，干凈且結(jié)構(gòu)合理。

Vuexybootstrap vue admin模板包含Vuejs、HTML（bootstrap4）、PHP（laravel 8）和 React （reactstrap）、Angular11。此外，這個圖形豐富的引導(dǎo)模板因其用戶友好的體驗和速度而受到全球開發(fā)人員的強烈推薦。此外，它是開發(fā)人員最友好的Vuejs+ HTML儀表板。其中包括100+卡，50+組件等等。

特征：

• 基于 BootstrapVue
• Vue 3 就緒 （組合API）
• bookstrap 4.5.3
• laravel8
• 添加了Sketch和Figma文件
• JWT身份驗證，ACL
• Internationalization/i18n & RTL Ready

Wjimo

Wjimo有100多個用于企業(yè)應(yīng)用程序的動態(tài)JavaScript UI組件。在Wjimo的幫助下，你可以將開發(fā)時間縮短一半。此外，你還可以快速構(gòu)建輕量級，高性能的HTML/ JavaScript UI應(yīng)用程序。

• FlexGrid 提供虛擬化渲染和無限的單元格模板
• 與所有 JavaScript 框架深度集成，包括 Angular、React、Vue、Ionic 和 Web Components
• 使用 80 多種圖表類型可視化數(shù)據(jù)
• 使用 OLAP 數(shù)據(jù)透視網(wǎng)格、數(shù)據(jù)透視圖和切片器分析數(shù)據(jù)
• FlexMap（測試版）我們最新的可視化地圖控件
• Cloropleth maps
• 散點圖
• 氣泡圖

Vuejs laravel管理模板

此管理模板是使用Vuejs2、Laravel5.4 和 Bootstrap4構(gòu)建的。VueJS專為從頭開始開發(fā)任何項目而設(shè)計，也可以與任何其他開發(fā)項目集成。vue的核心庫主要與表示層相關(guān)聯(lián)，很容易與其他庫或現(xiàn)有項目一起使用。

特征：

• 完全基于 VueJS
• 未使用 jQuery
• 提供 7 種布局選項
• 多種面包屑設(shè)計
• 添加了多個配色方案

Coloban

具有聊天，看板，通話，屏幕共享等功能的一體化項目管理工具。

Commander

它是在本地和云中管理無服務(wù)器和容器基礎(chǔ)結(jié)構(gòu)的最佳開發(fā)人員IDE 之一。支持30 多種最佳云服務(wù)。借助10 多個部署和測試運行程序，你可以配置一次，然后一遍又一遍地重復(fù)。配置Ansible 和無服務(wù)器環(huán)境變量。直接調(diào)用lambda，或使用我們的測試運行程序測試S3、SQS、SNS、DynamoDB流 Lambda 調(diào)用。

它可以幫助你：

• 可視化你的系統(tǒng)
• 提高團隊速度
• 更快的提升時間
• 提高生產(chǎn)力

Moonitor

Moonitor可以實時為你提供加密貨幣資產(chǎn)的清晰概覽。

LaravelVue 管理模板（免費）




Laravel+ VueJS是交付響應(yīng)式Web應(yīng)用程序和項目的最佳組合。此列表包括最好的免費和高級LaravelVuejs管理模板，以節(jié)省你的寶貴的時間。在這里，你將看到一些基于前端框架Vue.js和Laravel作為后端框架而構(gòu)建的出色管理模板。

Vuelibs

Vuelib是Vue.js庫，框架，實用程序和組件的列表。

Vue文章

在這里，你可以找到有關(guān)vue2 和vue3 的詳細(xì)文章。它還提供帶有示例的教程。

Madewithvuejs：使用Vue.js制作的一系列項目

使用Vuejs制作是網(wǎng)站，管理模板，應(yīng)用程序，實用程序，UI組件，庫等的豐富集合;這是用VueJS制作的。你還將獲得書籍，插件，圖表等。

Vuejs examples

VueJS示例，顧名思義，它是使用VueJS制作的簡單且可自定義的步驟進(jìn)度指示器，Vue自動貸款計算器，通知/Toast組件等示例的集合。不僅如此，它還提供了使用VueJS制作的UI，游戲，元素，媒體等組件。

用戶界面組件：

組件是使用具有更好一致性的較小、可重用部分來設(shè)計和開發(fā)UI的好方法。組件在設(shè)計和開發(fā)之間提供更好的協(xié)作，使你的設(shè)計語言隨著時間的推移而發(fā)展。

表格

以下是Vue的一些表組件和ag-grid組件。

• Vue Materialize Data table - 一個花哨的Materialize CSS 數(shù)據(jù)表VueJS組件。
• Vue Tables-2 - Vue.js 2 個網(wǎng)格組件。
• 獵豹網(wǎng)格 - 最快的網(wǎng)絡(luò)開源數(shù)據(jù)表。
• vue-datasource - 一個 vue.js服務(wù)器端組件來創(chuàng)建動態(tài)表。
• ag-grid-vue – 適用于ag-Grid的vue適配器.
• vue-data-tables
• vue-teible - 用于 Web 的輕量級和靈活的表格組件
• vuejs-smart-table - 使用 vanilla HTML Table結(jié)構(gòu)的直線表組件
• fancy-grid-vue -適用于 FancyGrid的vue適配器

通知

使用無模式臨時小彈出窗口通知用戶

• Vue Toasted - 適用于 VueJS 2+ 的響應(yīng)式觸摸兼容 Toast 插件
• Vuex Flash - Vuex 中的 VueJs Flash Message Component
• Vue Notification Bell - 用于顯示通知的 Vue UI 組件。
• Vue Notification – 具有被動方法的vue.js3的加載器管理器。
• Vue Toast Notification - 又一個 Vue.js Toast 通知插件
• VueToastify - 一個大驚小怪的免費通知組件。
• vue-toaster - Vue.js Vue 3 的 toast notification plugin

加載

加載程序/微調(diào)器/進(jìn)度條— 讓用戶知道正在加載某些內(nèi)容

• Vue 徑向進(jìn)度 - Vue 的徑向進(jìn)度條組件.js。
• Vue wait - 用于 Vue/Vuex 和 Nuxt 應(yīng)用程序的復(fù)雜加載程序管理。
• Vue-ultimate-skeleton-cards - 用于 Vue的終極、完全可定制的 Skeleton Card 插件
• Vue-wait-for - Vue.js 3 的加載程序管理器，帶有反應(yīng)式方法
• Vue-content-loader - SVG組件，用于創(chuàng)建占位符加載，如Facebook卡片加載
• vue-element-loading - 在容器內(nèi)加載或全屏加載 Vue.
• tb-skeleton - 用于 Vue 的骨架屏幕加載.js
• vue-spinners - 用于 Vuejs 的加載微調(diào)器組件的集合

圖標(biāo)

• Vue ionicons - 來自 Ionic Team 的組件。
• Vue awesome -使用內(nèi)聯(lián)SVG為vue.js子體更改組件
• Mdi vue - Vuejs 的 材料設(shè)計圖標(biāo)組件
• vue-zondicons -美麗的 Zondicon svg 圖標(biāo)的Vue 組件
• vue-eva-icons – 簡單的開源eva圖標(biāo)作為Vue組件。
• vue-unicons - 1000+ 像素完美的 svg unicons，用于你的下一個項目作為 Vue 組件。

菜單

• VueJS 下拉列表 - Vue.js 2 下拉菜單組件。重量輕，使用方便，擴展方便，無需外部設(shè)備。
• Vue 簡單菜單 - 具有一組基本功能的簡單菜單組件。
• Vue 樹導(dǎo)航 - Vue.js 2 樹導(dǎo)航，支持 vue 路由器
• bp VueJS 下拉列表 - Vuejs => 2 下拉列表。易于使用，無需外部，可選。
• Vue Bulma 手風(fēng)琴 - 簡單、易于配置的手風(fēng)琴或可折疊樣式，提供 Bulma 自定義或內(nèi)置圖標(biāo)
• Vue-stripe-menu - 創(chuàng)建一個帶有動畫的導(dǎo)航菜單，就像在Stripe上一樣

圖表

• Flowchart-vue - Vue 的 Flowchart & Flowchart designer component for Vue.js。
• Vue-d3-barchart - 使用 d3 繪制圖表的小組件。
• Vue3-highcharts -Vue 3 的 Highcharts.JS包裝器組件
• Echarts-for-vue - Vue 3 and 2的包裝組件
• Vue3-chart-v2 - 基于 Vue 3 的 Chart.JS 的 Vue 包裝器組件
• vue-apexcharts - ApexCharts 的Vue.js組件
• vue-doughnut-chart - 用于 Vue 的 Doughnut 圖表組件.js。
• v-charts - 基于 Vue2.x 和 Echarts 的圖表組件。

日歷

• Vue datepicker ui - Vue的日期選擇器組件
• Vue 日期工具 - 最輕量級的 VueJS 日期選取器和日期范圍選取器，使用 date-fns 且沒有其他依賴項
• Vue 春季日歷 - 它是一個基于 Vue 的組件，提供顯示每日事件的完整日歷的功能。
• Vue jquery calendar - 適用于jquery ui
• Vue 日程安排板 - 一個易于使用的組件，用于顯示某人的日程安排列表，以幫助安排面試或訪問安排。
• Vue 陰歷 pro - 陰歷的 vue 組件。使用日歷.js進(jìn)行日期操作。

播客

• DNE 138 - Vale a pena VueJS？(01-05-2018)
• 憤世嫉俗的開發(fā)人員 #99 （10-15-2018）
• 語法 #130 （03-27-2019）
• 享受 Vue：新的 Vue.js播客

求職：

• Vue.js Jobs - VueJobs - 一個Vue.js工作門戶，用于雇用或被雇用所有Vue.js工作。
• Vue.js面試問題 - 300個VueJS面試問題和答案列表
• Prokarman簡歷生成器 - 一個免費的簡歷生成器，用于為您夢想的工作制作簡歷。

服務(wù)器端呈現(xiàn)

• 通用 vue
• 因子平臺 - 擴展驅(qū)動的 VueJS 平臺 （Factor.dev → 文檔)
• Vapper - 基于 Vue 的服務(wù)器端渲染框架。

靜態(tài)網(wǎng)站生成器

• VuePress - 極簡主義的Vue供電的靜態(tài)站點生成器。
• Peco - 人類的靜態(tài)網(wǎng)站生成器。未維護
• Saber - 一個靜態(tài)網(wǎng)站生成器，用于使用Vue.js構(gòu)建超快的網(wǎng)站。
• Gridsome - 使用 Vue 構(gòu)建超快速、現(xiàn)代的網(wǎng)站.js
• Servue - 服務(wù)器端渲染引擎，將 vue 文件渲染為 HTML 字符串。

社區(qū)

• 推特
• 官方論壇
• vueslack - 全球2300 +注冊用戶
• Vue Land - Discord chat server

結(jié)論：

在這里，我們提到了一些非常有用的VueJS資源。當(dāng)你使用VueJS項目時，你肯定需要一些工具，UI組件庫，管理模板等。因此，為了幫助節(jié)省時間，我們在這里收集了一些驚人的資源，這樣你就不必在這里和那里搜索。你可以查看下一個項目。

希望你發(fā)現(xiàn)此集合有用。

來源：duing