cli 是 Command Line Interface,也就是命令行接口,所謂接口就是我們可以通過命令行方式進行些 vue 給我們提供的操作。t
這裏解釋一下 CLI 的用途,其實就是爲了便於開發 vue 應用,爲我們事先寫好的腳步,來幫助我們快速搭建 vue 項目,避免一些繁瑣乏味的配置。同樣在搭建項目時爲我們提供許多選項便於搭建出適合自己應用的 vue 項目。out-of-the-box 就是開包即用,拎包入住的感覺。
我們也可以選擇一些項目中需要的庫,各個庫之間相互依賴的關係 CLI 也通過插件形式幫助我們進行管理。
而且通過配置 webpack 我們可以將項目 src 下 javascript 文件、css 樣式文件和他們依賴都打包一個文件,並不是簡單打包在一起,這裏還會對代碼進行一些優化。
可以自由地創建一個 vue 組件,組件包換 html 結構 css 樣式和 javascript 文件,組件可以輕鬆地被複用在我們的項目中。同時安裝插件,讓我們可以 typescript 來寫 javascript 也可以用 scss 或 less 來寫 css,還可以用 pug 來寫 html 只要您願意
啓動模塊熱替換(HMR)功能,當我們編輯代碼同時,改變就會立即反應到我們頁面,這樣給我們開發帶來了許多快樂
要使用 vue cli 我們先安裝 npm。
在安裝了 npm 後,我們在命令行輸入 npm i -g @vue/cli 來全局安裝 vue cli 庫。
安裝會稍微需要一點時間,稍等片刻。
然後我們就可以 vue 命令來創建一個項目了, vue create 項目名稱來創建項目。
在創建過程中,vue cli 這裏提供了許多選項,我們可以選擇 Manually select features 來手動配置來創建我們項目。
Babel 是一種優化編譯器,Router 是 vue 的路由進行擴展的庫,Linter 是檢查我們的代碼的工具,這裏就是我們創建項目作出的選擇。
我們可以選擇一個腳手架來搭建項目,這裏有兩種選擇一個 npm 一個是 yarn,個人也偏好 npm。
做出所有的選擇,我們就可以享受一下等待項目,等待 cli 根據我們的選擇來搭建專屬於我們的 vue 項目。
然後進入創建項目下,運行 npm run serve 來啓動我們項目,當您看到下面畫面恭喜您成功地用 cli 創建了 vue 項目