一、安裝 @vue/cli
更新到 3.x 之後,vue-cli 的包名從vue-cli
改成了@vue/cli
如果之前全域性安裝了舊版本的vue-cli (1.x 或 2.x)
,首先需要使用以下命令解除安裝掉
npm uninstall vue-cli -g安裝完成後,可以使用# or
yarn global remove vue-cli
npm install -g @vue/cli
# or
yarn global add @vue/cli
vue -v
(這個 v 是大寫的)檢視版本號
二、建立專案的三種方式
1.x
和2.x
的vue-cli
採用 init 命令建立專案
vue init webpack project-name
3.x
也支援這種方式,其執行結果和以前一樣
vue/cli 3.x
還新增了圖形化的方式來建立專案
首先在指定目錄下開啟終端,執行:
vue ui然後瀏覽器會開啟乙個頁面,可以按照頁面將的引導建立專案
但是最好還是使用命令列工具
vue create project-name //三、引數詳解使用project-name是自定義的專案名稱
create
命令建立專案的時候,有很多配置項需要選擇
首先需要選擇模組,可以上下鍵切換,單項選擇直接回車繼續下一步,多項選擇可配合著空格選擇不同的選項
如果選擇預設選項default
,將會構建乙個最基本的 vue 專案(沒有 vue-router 也沒有 vuex)
這裡推薦選擇第二項manually select features
然後根據自己的需求,使用空格鍵選擇具體的模組
default(babel, eslint) 預設配置,提供babel和eslint支援
manually select features 自定義選擇需要的功能,提供更多的特性選擇。
typescript 支援使用 typescript 編寫程式下面:router 支援 vue-router 。
vuex 支援 vuex 。
css pre-processors 支援 css 預處理器。
linter /formatter 支援**風格檢查和格式化。
unit testing 支援單元測試。
e2e testing 支援 e2e 測試。
use history mode for router?*******history模式 這個看專案需要,history模式需後端支援,自行考慮less/scss***我用的是less
**規範,直接選standard標準的規範就行了
最後選擇是否將配置項儲存為預設,然後配置完成,開始生成專案
vue cli2 x與vue cli3 x的搭建
vue cli2.x與vue cli3.x的搭建 搭建前提條件 一 node環境 這裡不詳細介紹 二 安裝webpack 執行npm install webpack g 三 安裝vue cli 2.x npm install vue cli g 建立專案 vue init webpack 專案名 不...
vue cli 3 x腳手架搭建及其配置
官方文件包含了很多的內容,很靠譜,比較全面,第一步當然是把官方文件看一遍。vue cli 需要 node.js 8.9 或更高版本 推薦 8.11.0 你可以使用 nvm 或 nvm windows在同一臺電腦中管理多個 node 版本。安裝命令 npm install g vue cli or y...
Vue CLI 3 x的使用 2 安裝
vue cli v3.x官方教程 關於與先前版本的說明 1.包名由vue cli變更為 vue cli 2.若需要全域性安裝舊版本的vue cli 1.x或2.x 則需要先解除安裝已安裝的版本,解除安裝指令 npm uninstall vue cli g或yarn global remove vue...