搭建Vue-cli3

一、安裝@vue/cli

1、載掉舊版本命令:

  • 裝了舊版本的建議先卸載舊版本,再安裝新版本,沒有舊版本省略這一步。
  • node版本要在8.9以上。
	npm uninstall vue-cli -g
	# OR
	yarn global remove vue-cli 

2、安裝cli3命令:

	npm install -g @vue/cli
	# OR
	yarn global add @vue/cli

3、檢查是否安裝完畢(CMD查看版本號)

	vue -V

二、創建項目

	vue create project-name

三、參數詳解

1、選擇默認(default)還是手動(Manually)

default,將會構建一個最基本的 vue 項目(沒有 vue-router 也沒有 vuex),推薦選擇第二項
在這裏插入圖片描述

2、然後項目的需求,使用空格鍵勾選具體的模塊,使用回車鍵進入下一步
在這裏插入圖片描述

3、選擇路由模式

y 是 history 模式,n 是 hash 模式;新手可以先從 hash 模式入手,不過實際項目通常採用 history 模式。
在這裏插入圖片描述

4、選擇CSS 的預編譯工具

stylus 不支持原生 CSS 寫法
在這裏插入圖片描述

5、選擇自動化代碼格式化檢測
在這裏插入圖片描述
6、語法檢查方式

第一項是保存檢測,第二項是fix和commit的時候檢測
在這裏插入圖片描述
7、單元測試

Mocha是流行的JavaScript測試框架之一,通過它添加和運行測試,從而保證代碼質量,chai 是斷言庫,我還沒用過。

8、特性的存放方式

第一項是獨立文件夾位置,第二項是在package.json文件裏,建議放在獨立文件中。
在這裏插入圖片描述
9、是否保存本次預設

選擇y的時候,下次創建項目時,可以直接使用這一次的配置

10、回車確定等待下載

四、啓動項目

	npm run serve

五、其他

如果還需要使用舊版本的 vue init 功能,可以全局安裝一個橋接工具

npm install -g @vue/cli-init
vue init webpack my-project
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章