vue持續(xù)流行，并被許多開發(fā)人員迅速采用，并且vue.js工具隨處可見。這并非沒有道理：vue的學(xué)習(xí)曲線淺，功能驅(qū)動(dòng)的結(jié)構(gòu)清晰明了，并且出色的文檔資料使新手可以輕松上手，而經(jīng)驗(yàn)豐富的開發(fā)人員也可以從其他框架（如react或angular）進(jìn)行切換。
如果您認(rèn)真對(duì)待vue開發(fā)，遲早會(huì)遇到一些脫穎而出的基本工具和庫。使用它們可以提升您作為vue開發(fā)人員的職業(yè)生涯，并使您感到自己像專家。
我已經(jīng)整理了一份清單，其中列出了您應(yīng)該了解并最終在vue.js項(xiàng)目中使用的最著名的工具和庫。與目前僅列出ui組件庫的許多其他文章不同，該匯編探索了vue生態(tài)系統(tǒng)中工具，庫和插件的廣泛混合。
我是根據(jù)它們的有用性，有效性和獨(dú)特性選擇它們的，而不是基于它們的github受歡迎程度或星級(jí)。
vue cli
如今，對(duì)于每個(gè)javascript應(yīng)用程序框架而言，似乎都必須具備某種cli工具。vue也不例外。vue cli是用于快速vue開發(fā)的功能齊全的工具集。除了通常的項(xiàng)目支架外，它還可以通過使用其即時(shí)原型制作功能來嘗試新的想法，甚至無需創(chuàng)建完整的項(xiàng)目。
默認(rèn)情況下，vue cli提供對(duì)主要web開發(fā)工具和技術(shù)的支持，例如babel，typescript，eslint，postcss，pwa，jest，mocha，cypress和nightwatch。這要?dú)w功于其可擴(kuò)展的插件系統(tǒng)。這意味著社區(qū)可以構(gòu)建和共享可重復(fù)使用的插件以滿足常見需求。
但是錦上添花的是功能強(qiáng)大的gui (vue ui，隨cli一起提供)，它允許您輕松地創(chuàng)建項(xiàng)目，然后在不需要彈出的情況下配置和管理項(xiàng)目。
點(diǎn)擊這里查看：vue cli
vuepress
vue生態(tài)系統(tǒng)中的下一個(gè)主要參與者是vuepress，這是一種由vue驅(qū)動(dòng)的靜態(tài)站點(diǎn)生成器。最初是作為編寫技術(shù)文檔的工具而創(chuàng)建的，現(xiàn)在它是一個(gè)小型，緊湊且功能強(qiáng)大的無頭cms。從1.x版開始，它提供了出色的博客功能和強(qiáng)大的插件系統(tǒng)。它帶有一個(gè)默認(rèn)主題（根據(jù)技術(shù)文檔提供），但是您也可以構(gòu)建自定義主題或使用社區(qū)中的預(yù)制選項(xiàng)。
在vuepress中，您可以在markdown中編寫內(nèi)容，然后將其轉(zhuǎn)換為預(yù)渲染的靜態(tài)html文件。加載這些文件后，您的站點(diǎn)將作為由vue，vue router和webpack支持的單頁應(yīng)用程序運(yùn)行。
vuepress的主要優(yōu)點(diǎn)之一是您可以在markdown文件中包含vue代碼或組件。這給您帶來了強(qiáng)大的功能和靈活性，因?yàn)槟鷰缀蹩梢韵癯Ｒ?guī)的vue應(yīng)用一樣開發(fā)網(wǎng)站，并從中獲得所有好處。
點(diǎn)擊這里查看：vuepress
gridsome
gridsome與vuepress有許多相似之處，但是在處理數(shù)據(jù)源時(shí)采用了一種非常強(qiáng)大的方法。它使您可以連接和使用應(yīng)用程序中的多種數(shù)據(jù)，然后將這些數(shù)據(jù)統(tǒng)一在一個(gè)graphql層中。基本上，gridsome將vue用于前端功能，將graphql用于數(shù)據(jù)管理。可以通過以下三個(gè)步驟總結(jié)其工作方式：
您以markdown，json，yaml或cvs數(shù)據(jù)格式提供內(nèi)容，或從wordpress或drupal等cms導(dǎo)入內(nèi)容。
內(nèi)容被轉(zhuǎn)換為graphql層，該層提供集中的數(shù)據(jù)管理。然后，您可以使用這些數(shù)據(jù)通過vue構(gòu)建您的應(yīng)用程序。
您可以將預(yù)渲染的html文件部署到靜態(tài)web主機(jī)或cdn，例如netlify，amazon s3，now.sh，surge.sh等。
gridsome提供了一些很好的最佳實(shí)踐，例如代碼拆分，資產(chǎn)優(yōu)化，漸進(jìn)式圖像和鏈接預(yù)取。因此，gridsome速度很快，并且支持pwa和seo友好。
點(diǎn)擊這里查看：gridsome
vuex
狀態(tài)管理是開發(fā)人員在web應(yīng)用程序構(gòu)建中遇到的主要問題之一。為了解決這個(gè)問題，vue提供了一個(gè)狀態(tài)管理系統(tǒng)vuex。它充當(dāng)應(yīng)用程序中所有組件的集中存儲(chǔ)，其中狀態(tài)只能以可預(yù)測的方式進(jìn)行更改。store是一個(gè)特殊的對(duì)象，分為四個(gè)部分：
state – 存儲(chǔ)應(yīng)用程序數(shù)據(jù)的對(duì)象
getters – 包含用于抽象訪問狀態(tài)的方法的對(duì)象
mutations – 包含直接影響狀態(tài)的方法的對(duì)象
actions – 包含用于觸發(fā)變異和執(zhí)行異步代碼的方法的對(duì)象
store也可以分為多個(gè)模塊，以實(shí)現(xiàn)更好的可維護(hù)性。
點(diǎn)擊這里查看：vuex
nuxt
在使用服務(wù)器端渲染（ssr）時(shí)，通常采用nuxt。這是用于構(gòu)建通用應(yīng)用程序的簡單直接的框架。它也是模塊化的，因此您只能使用應(yīng)用程序所需的那些模塊。
使用nuxt，您可以創(chuàng)建服務(wù)器呈現(xiàn)的應(yīng)用程序（ssr），單頁應(yīng)用程序（spa），漸進(jìn)式web應(yīng)用程序（pwa），或僅將其用作靜態(tài)站點(diǎn)生成器。
簡而言之，nuxt使您擺脫了結(jié)構(gòu)化和優(yōu)化應(yīng)用程序的繁瑣工作，從而為您提供了精簡且更令人愉悅的開發(fā)體驗(yàn)。
點(diǎn)擊這里查看：nuxt
vuetify
vuetify是目前最好的ui組件庫之一。它基于material design規(guī)范提供了大量的精心設(shè)計(jì)的組件（80多個(gè)），幾乎可以滿足任何應(yīng)用程序的需求。
您可以使用它來構(gòu)建ssr應(yīng)用程序，spa，pwa和移動(dòng)應(yīng)用程序。您可以啟動(dòng)新應(yīng)用或?qū)⑵涮砑拥浆F(xiàn)有應(yīng)用中。它提供免費(fèi)和高級(jí)主題，但是您也可以構(gòu)建自己的主題。它還提供了一個(gè)僅選擇和選擇正在使用的組件的系統(tǒng)，從而極大地減少了應(yīng)用程序的最終大小。
vuetify的所有組件都有很好的文檔記錄，并提供了清晰的示例。
點(diǎn)擊這里查看：vuetify
quasar
quasar是javascript版本的“一次寫入，到處運(yùn)行”的java哲學(xué)。它是一個(gè)通用的、支持vue的框架，允許您使用相同的代碼庫為不同的平臺(tái)編寫應(yīng)用程序。spas，pwas，ssr應(yīng)用，混合移動(dòng)應(yīng)用或多平臺(tái)桌面應(yīng)用，你來命名吧！
它有很好的文檔和大量的組件，設(shè)計(jì)時(shí)考慮到了性能和響應(yīng)能力。quasar默認(rèn)情況下集成了最佳實(shí)踐（html/css/js縮小、緩存破壞、樹抖動(dòng)、源映射、延遲加載的代碼拆分、es6傳輸、代碼linting、可訪問性），因此您可以主要關(guān)注應(yīng)用程序的功能。它還為新項(xiàng)目的輕松搭建提供了一個(gè)cli工具。
點(diǎn)擊這里查看：quasar
storybook
vue主要是一個(gè)基于組件的框架，因此編寫好的、高效的組件對(duì)每個(gè)應(yīng)用程序開發(fā)人員都至關(guān)重要。在此過程中，storybook可能會(huì)派上用場。它使您可以在易于使用和隔離的環(huán)境中開發(fā)，管理和測試ui組件。該工具使開發(fā)人員可以獨(dú)立于主應(yīng)用程序創(chuàng)建組件，并在隔離的開發(fā)環(huán)境中交互式地展示它們，而不必?fù)?dān)心特定于應(yīng)用程序的依賴性和要求。
storybook提供了許多附加組件，以及靈活的api，可以根據(jù)需要定制storybook。還可以導(dǎo)出一個(gè)靜態(tài)web應(yīng)用程序，并將項(xiàng)目部署到任何http服務(wù)器。
點(diǎn)擊這里查看： storybook
vue apollo
最近有很多關(guān)于graphql的討論。因此，如果你已經(jīng)熟悉它，并希望將其與vue集成，你應(yīng)該嘗試vue apollo。這個(gè)庫使vue和graphql/apollo的使用更加流暢和愉快。
點(diǎn)擊這里查看：vue apollo
eagle.js
eagle.js是使用vue構(gòu)建的功能強(qiáng)大，靈活且獨(dú)特的幻燈片系統(tǒng)。它使您可以在演示文稿中創(chuàng)建易于重復(fù)使用的組件，幻燈片和樣式。它還支持動(dòng)畫，主題和交互式小部件，非常適合制作web演示。eagle.js具有簡單且易于破解的api，因此您可以真正自由地制作所需的幻燈片。
您可以使用此庫執(zhí)行的最大操作之一是將幻燈片放到單獨(dú)的文件中，然后在其他幻燈片放映中重復(fù)使用。您也可以將特定幻燈片的幻燈片導(dǎo)入另一個(gè)幻燈片中。使用如此強(qiáng)大的工具，您可以進(jìn)行復(fù)雜，交互式且有趣的演示。
點(diǎn)擊這里查看：eagle.js
5個(gè)更著名的vue工具和庫
vue devtools是一個(gè)很棒的瀏覽器擴(kuò)展，用于調(diào)試vue和vuex應(yīng)用程序。
vue test utils 是用于測試vue組件的有用實(shí)用程序的集合。
vue router 是vue的官方路由。
vue native 是用于移動(dòng)應(yīng)用程序的javascript框架，類似于react native。
weex 是使用現(xiàn)代網(wǎng)絡(luò)技術(shù)（包括vue）構(gòu)建移動(dòng)應(yīng)用程序的框架。
原文地址：https://www.zeolearn.com/interview-questions/vue-js
相關(guān)推薦：
2020年前端vue面試題大匯總（附答案）
vue教程推薦：2020最新的5個(gè)vue.js視頻教程精選
更多編程相關(guān)知識(shí)，請(qǐng)?jiān)L問：編程入門！！

云是否被“邊緣”化了？剖析邊緣云計(jì)算對(duì)云戰(zhàn)略的長期影響
【黃山網(wǎng)站建設(shè)】網(wǎng)站打開速度過慢的原因分析
云服務(wù)器數(shù)據(jù)會(huì)丟失嗎
細(xì)微處見功夫！聊聊那些不被重視的交互稿細(xì)節(jié)
摩拜關(guān)閉國際業(yè)務(wù)：將關(guān)閉不符合運(yùn)營目標(biāo)的業(yè)務(wù)
cloud域名要實(shí)名嗎
電腦中wmiprvse是什么進(jìn)程
三明市彈性云服務(wù)器報(bào)價(jià)