@vue/cli 跟 vue-cli 相比,@vue/cli 的優勢在哪?

一、Vue CLi的初衷

Vue-cli: 開箱即用,但強制性強,需要按照它的規則進行

Vue CLI:開箱即用,簡單易用

 

二、爲什麼要對 Vue-cli 進行修改

舊版本的 Vue-cli 本質上只是從 GitHub 拉取模版,它就像一個模版拷貝器, 這樣的拉取模版的方式有幾個問題

1、單個模版之間相互依賴,耦合性太高,無法實現共享功能和互相遷移,使得模版本身變得及其複雜和難以維護

2.  webpack 配置和構建包含在倉庫內,如 webpack 被改動,則會影響其他關聯的插件

 

三、解決Vue-cli問題:

1. 依賴 vue-service:

CLI3 將Webpack的配置和邏輯全部封裝在依賴中,同時允許用戶通過 Vue.config.js 配置進行修改 Webpack,

好處是:CLI 3 更新後,並不會影響到其他插件,此時我們只需要專注與功能,底層的配置只需要交給 Vue 團隊去進行維護即可。

 

2. 插件化:

   CLI3 通過插件的形式去支持多個不同的功能,一個插件對應一個功能,比如(router, TS, Test), 這樣避免了多個模版,使得 CLi 自身的可維護性得到提升,同時支持第三方插件。

 

四、總結:

  VueCLI React
快速原型開發 支持 -
全局模式 通過 @vue/cli + @vue/cli-service-global 實現的零配置原型開發。 -
插件 支持,提供可選功能的 npm 包 -
擴展性

可以通過插件進行擴展

強約定, 無法配置 webpack,可以 eject
適用範圍 通過擴展可以支持任意前端框架 針對 React 開發,不支持其他框架
編譯速度 cache-loader,thread-loader 來加速 JS 和 TS 編譯 babel-loader 開啓了 cache
可升級性 依賴 (@vue/cli-service),該依賴可升級,升級後,webpack會跟隨着升級 支持
多頁面 支持 -
GUI

支持,一套完全圖形化的創建和管理 Vue.js 項目的用戶界面。

-

 

五、參考 VueCLI 的文檔

 

 

 

六、文獻:

1. Vue作者尤雨溪:Vue CLI 3.0重構的原因

2. 爲什麼使用vue-cli腳手架?vue-cli3.0的優勢在哪裏?

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章