? ?現(xiàn)在前端除了JavaScript外，還有react，vue，angular這三個(gè)框架在市場(chǎng)上用的比較多，可以說(shuō)這三個(gè)框架很大程度上改變了前端的地位，相對(duì)于angular來(lái)說(shuō)，vue同樣擁有豐富的指令，并且都是典型的MVC框架，vue相對(duì)來(lái)說(shuō)輕量級(jí)一些，

目前vue被很多開(kāi)發(fā)人員所采用，也越來(lái)越熱門(mén)，，因此它的生態(tài)環(huán)境也變得完善起來(lái)，相關(guān)的工具也很豐富，這主要是依靠vue的學(xué)習(xí)曲線和清晰的設(shè)計(jì)結(jié)構(gòu)和使用文檔，是讓有經(jīng)驗(yàn)的開(kāi)發(fā)人員從其他框架方便入手。Vue的開(kāi)發(fā)工具有哪些？

?? Vue CLI

?? 為了方便開(kāi)發(fā)人員快速入門(mén)，他像奇怪的框架一樣，為CLI提供了類似的手和腳架工具。VueCLI是一組功能齊全的工具，可以用快速的Vue開(kāi)發(fā)。VUE規(guī)范了VUE生態(tài)系統(tǒng)中的工具基礎(chǔ)，保證了各種構(gòu)建工具在智能默認(rèn)配置的基礎(chǔ)上能夠順利連接，從而可以專注于應(yīng)用程序的編寫(xiě)，而不必花很長(zhǎng)時(shí)間來(lái)解決配置問(wèn)題。例如，在一個(gè)項(xiàng)目中很容易集成插件，如Babel、Typee、ESLint、PostCSS、Jest、Mocha、Nightwatch和Cypress。

?? Vue Press

?? VuePress是以Vue驅(qū)動(dòng)的靜態(tài)網(wǎng)站生成器，是由Vue, Vue Router和webpack驅(qū)動(dòng)的單頁(yè)應(yīng)用，在VuePress中，可以使用Markdown編寫(xiě)文檔，然后生成網(wǎng)頁(yè)，每一個(gè)由VuePress生成的頁(yè)面都有著預(yù)渲染好的HTML，也因此具有非常好的加載性能和搜索引擎優(yōu)化，同時(shí)，一旦頁(yè)面被加載，Vue將會(huì)接管這些內(nèi)容，并把他轉(zhuǎn)換成一個(gè)完整的單頁(yè)應(yīng)用，其他的頁(yè)面則只會(huì)在用戶瀏覽到的時(shí)候才需加載，

?? Vuex

?? 在SPA單頁(yè)組件的開(kāi)發(fā)中Vue的vuex和React的React都是統(tǒng)稱為同一狀態(tài)管理，也可以叫全局狀態(tài)管理，簡(jiǎn)單的理解就是你在state中定義了一個(gè)數(shù)據(jù)之后，就可以在所在項(xiàng)目中的任何一個(gè)組件里進(jìn)行獲取，進(jìn)行修改，并且修改部分可以得到全局的響應(yīng)變化，每一個(gè)Vuex應(yīng)用的核心就是Store，store可當(dāng)做一個(gè)容器，包含著應(yīng)用中大部分狀態(tài)。

? ? ? ? Nuxt

?? Nuxt.js是一個(gè)基于Vue.JS輕量級(jí)應(yīng)用程序框架，可以用來(lái)創(chuàng)建服務(wù)器端渲染應(yīng)用程序，也可以作為靜態(tài)站點(diǎn)引擎生成靜態(tài)站點(diǎn)應(yīng)用程序，具有優(yōu)雅的代碼結(jié)構(gòu)分層和熱加載功能。

? ? ? ? Vuetify

? ? Vutify當(dāng)前是基于VUI的最佳UI組件庫(kù)之一。它提供了大量基于材料設(shè)計(jì)規(guī)格的部件，可滿足任何應(yīng)用的需要。

?? Quasar

?? Quasar是MIT授權(quán)的初始框架，它基于Vue，可以幫助web開(kāi)發(fā)人員創(chuàng)建響應(yīng)性網(wǎng)站。PWA通過(guò)apacha Cordova構(gòu)建移動(dòng)應(yīng)用程序。多平臺(tái)應(yīng)用類星體需要開(kāi)發(fā)者編寫(xiě)一次左右的代碼，然后使用相同的代碼庫(kù)同時(shí)部署到網(wǎng)站、PWA、移動(dòng)應(yīng)用和電子應(yīng)用。使用最先進(jìn)的CLI設(shè)計(jì)應(yīng)用程序并提供精心編寫(xiě)的類星體Web組件非?？?。

?? ? ?? Storybook

?? 對(duì)于前段來(lái)說(shuō)，組件化技術(shù)已經(jīng)是必修的一門(mén)課程了，這其中又以react和vue為主，但平時(shí)在開(kāi)發(fā)組件，尤其是公共組件或第三方組件時(shí)會(huì)有些困擾，

?? 1. 不能很好的管理組件，預(yù)覽組件時(shí)不能一目了然，也不能很好的反應(yīng)一個(gè)組件的不同狀態(tài)，

?? 2. 自動(dòng)化交互測(cè)試可以使用enzyme，但很多時(shí)候還得手動(dòng)測(cè)試，

?? 3. 在寫(xiě)文檔時(shí) 需要將組件預(yù)覽和文檔寫(xiě)在一起，并需要切換不同狀態(tài)，

? 因此，storbook就是要解決這些問(wèn)題。它可以為組件構(gòu)建一個(gè)強(qiáng)大的開(kāi)發(fā)環(huán)境，主要提供以下幾點(diǎn)

?1.?提供功能強(qiáng)大的UI組件管理頁(yè)面，可以輕松清晰地分組、管理多個(gè)組件或組件的不同狀態(tài)。

?2.?除了自動(dòng)交互測(cè)試外，還可以方便地進(jìn)行手動(dòng)交互測(cè)試，并可以動(dòng)態(tài)更改組件參數(shù)和查看更改。

? ? 3. 可以將組件預(yù)覽導(dǎo)出為靜態(tài)資源，這樣就可以很方便查看組件的文檔和不同參數(shù)對(duì)應(yīng)的不同視圖 還有一系列插件，更好的幫助我們完成開(kāi)發(fā) 測(cè)試 優(yōu)化組件工作。

此工具使開(kāi)發(fā)人員能夠獨(dú)立于主要應(yīng)用程序組件，在獨(dú)立的開(kāi)發(fā)環(huán)境中交互地呈現(xiàn)它們，而不必?fù)?dān)心特定應(yīng)用程序的依賴性和需求，從而方便開(kāi)發(fā)人員、設(shè)計(jì)人員和其他人員參與項(xiàng)目。

?