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

目前vue被很多(duō)開發人(rén)員(yuán)所采用(yòng)，也(yě)越來(lái)越熱(rè)門，，因此它的(de)生态環境也(yě)變得(de)完善起來(lái)，相關的(de)工具也(yě)很豐富，這(zhè)主要是依靠vue的(de)學習(xí)曲線和(hé)清晰的(de)設計結構和(hé)使用(yòng)文檔，是讓有經驗的(de)開發人(rén)員(yuán)從其他(tā)框架方便入手。Vue的(de)開發工具有哪些？

   Vue CLI

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

   Vue Press

   VuePress是以Vue驅動的(de)靜态網站生成器，是由Vue, Vue Router和(hé)webpack驅動的(de)單頁應用(yòng)，在VuePress中，可(kě)以使用(yòng)Markdown編寫文檔，然後生成網頁，每一個(gè)由VuePress生成的(de)頁面都有著(zhe)預渲染好的(de)HTML，也(yě)因此具有非常好的(de)加載性能和(hé)搜索引擎優化(huà)，同時(shí)，一旦頁面被加載，Vue将會接管這(zhè)些内容，并把他(tā)轉換成一個(gè)完整的(de)單頁應用(yòng)，其他(tā)的(de)頁面則隻會在用(yòng)戶浏覽到的(de)時(shí)候才需加載，

   Vuex

   在SPA單頁組件的(de)開發中Vue的(de)vuex和(hé)React的(de)React都是統稱爲同一狀态管理(lǐ)，也(yě)可(kě)以叫全局狀态管理(lǐ)，簡單的(de)理(lǐ)解就是你在state中定義了(le)一個(gè)數據之後，就可(kě)以在所在項目中的(de)任何一個(gè)組件裏進行獲取，進行修改，并且修改部分(fēn)可(kě)以得(de)到全局的(de)響應變化(huà)，每一個(gè)Vuex應用(yòng)的(de)核心就是Store，store可(kě)當做(zuò)一個(gè)容器，包含著(zhe)應用(yòng)中大(dà)部分(fēn)狀态。

        Nuxt

   Nuxt.js是一個(gè)基于Vue.JS輕量級應用(yòng)程序框架，可(kě)以用(yòng)來(lái)創建服務器端渲染應用(yòng)程序，也(yě)可(kě)以作爲靜态站點引擎生成靜态站點應用(yòng)程序，具有優雅的(de)代碼結構分(fēn)層和(hé)熱(rè)加載功能。

        Vuetify

    Vutify當前是基于VUI的(de)最佳UI組件庫之一。它提供了(le)大(dà)量基于材料設計規格的(de)部件，可(kě)滿足任何應用(yòng)的(de)需要。

   Quasar

   Quasar是MIT授權的(de)初始框架，它基于Vue，可(kě)以幫助web開發人(rén)員(yuán)創建響應性網站。PWA通(tōng)過apacha Cordova構建移動應用(yòng)程序。多(duō)平台應用(yòng)類星體需要開發者編寫一次左右的(de)代碼，然後使用(yòng)相同的(de)代碼庫同時(shí)部署到網站、PWA、移動應用(yòng)和(hé)電子應用(yòng)。使用(yòng)最先進的(de)CLI設計應用(yòng)程序并提供精心編寫的(de)類星體Web組件非常快(kuài)。

        Storybook

   對(duì)于前段來(lái)說，組件化(huà)技術已經是必修的(de)一門課程了(le)，這(zhè)其中又以react和(hé)vue爲主，但平時(shí)在開發組件，尤其是公共組件或第三方組件時(shí)會有些困擾，

   1. 不能很好的(de)管理(lǐ)組件，預覽組件時(shí)不能一目了(le)然，也(yě)不能很好的(de)反應一個(gè)組件的(de)不同狀态，

   2. 自動化(huà)交互測試可(kě)以使用(yòng)enzyme，但很多(duō)時(shí)候還(hái)得(de)手動測試，

   3. 在寫文檔時(shí) 需要将組件預覽和(hé)文檔寫在一起，并需要切換不同狀态，

  因此，storbook就是要解決這(zhè)些問題。它可(kě)以爲組件構建一個(gè)強大(dà)的(de)開發環境，主要提供以下(xià)幾點

 1. 提供功能強大(dà)的(de)UI組件管理(lǐ)頁面，可(kě)以輕松清晰地分(fēn)組、管理(lǐ)多(duō)個(gè)組件或組件的(de)不同狀态。

 2. 除了(le)自動交互測試外，還(hái)可(kě)以方便地進行手動交互測試，并可(kě)以動态更改組件參數和(hé)查看更改。

    3. 可(kě)以将組件預覽導出爲靜态資源，這(zhè)樣就可(kě)以很方便查看組件的(de)文檔和(hé)不同參數對(duì)應的(de)不同視圖 還(hái)有一系列插件，更好的(de)幫助我們完成開發 測試 優化(huà)組件工作。

此工具使開發人(rén)員(yuán)能夠獨立于主要應用(yòng)程序組件，在獨立的(de)開發環境中交互地呈現它們，而不必擔心特定應用(yòng)程序的(de)依賴性和(hé)需求，從而方便開發人(rén)員(yuán)、設計人(rén)員(yuán)和(hé)其他(tā)人(rén)員(yuán)參與項目。