警告
這篇文檔是關于 @vue/cli,如果想看舊版本 vue-cli 的內容米罚,點擊這里
Vue Cli 是一套專門為 Vue.js 快速開發(fā)服務提供的全系統(tǒng),提供了:
- 通過 @vue/cli 提供了交互工程腳手架
- 通過 @vue/cli 和 @vue/cli-service-global 提供了零配置快速原型
- 一個運行時依賴(@vue/cli-service)包括
- 可升級的
- 基于 webpack 進行構建蔗坯,配置合理的默認值
- 通過工程中的配置文件進行配置
- 通過插件實現(xiàn)可擴展
- 一個集成了前端生態(tài)系統(tǒng)中最好工具的官方插件庫
- 一個創(chuàng)建和管理 Vue.js 項目的全圖形化用戶界面
Vue Cli 目標是成為基于 vue 生態(tài)系統(tǒng)的標準工具琼稻。它確保大量的構建工具平穩(wěn)運行并且有合理的初始值,因此讓人專注于寫應用而不是花大量的時間和配置文件打交道商膊。與此同時伏伐,它提供了彈性方案去微調每個工具的配置而不需要額外的推進
系統(tǒng)組件
如果你去看源代碼,就會發(fā)現(xiàn) Vue Cli 有幾個可移動的部分晕拆,它是包含一系列分離并已發(fā)布依賴包的收購站
CLI
CLI(@vue/cli) 是一個全局安裝的 npm 依賴包藐翎,它在命令行提供 vue 命令,通過 vue create 提供了快速用腳手架搭建一個新項目的能力实幕,或者通過 vue serve 實現(xiàn)快速原型的想法吝镣。也可以通過 vue ui 使用圖形化用戶界面來管理項目。接下來教程的一些片段昆庇,我們將瀏覽到它能實現(xiàn)什么末贾。
CLI Service
CLI Service 是一個開發(fā)依賴,它是通過 @vue/cli 安裝在每個本地項目的 npm 包整吆。
CLI Service 基于 webpack 和 webapck-dev-server 未舟,包括:
- 加載其他 CLI Plugins 的核心服務
- 優(yōu)化大多數(shù) app 的 webpack 內部配置
- 在工程里面的 vue-cli-service 加法器圈暗,包含基礎的 serve,build 和 inspect 命令
如果你熟悉 create-react-app, 那么 @vue/cli-service 可以大致理解成 react-scripts裕膀,當然员串,實現(xiàn)細節(jié)還是不同的。
CLI Service 部分包含它的詳細使用方法昼扛。
CLI Plugins
CLI Plugins 是可以在你的 Vue CLI 工程中提供可選功能的 npm 包, 比如 Babel/TypeScript 轉換器寸齐,ESLint 集成,單元測試抄谐,端對端測試渺鹦。可以很容易識別一個 Vue CLI plugin 蛹含,因為他們的名字是 @vue/cli-plugin-(內嵌 plugins) 或者 vue-cli-plugin- 開頭(社區(qū) plugins)
當你在項目中運行 vue-cli-service 加法器時毅厚,它會自動解析并加載在項目 package.json 中的所有 CLI Plugins。
plugins 能夠在項目創(chuàng)建時添加或者在之后添加到項目中浦箱,他們可以被分組成可利用的預設吸耿。我們將在 Plugins and Presets部分進行深入的討論。