一、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 的文檔
六、文獻:
2. 爲什麼使用vue-cli腳手架?vue-cli3.0的優勢在哪裏?