文檔:https://cli.vuejs.org/zh/guide/
參考文章:http://www.reibang.com/p/5e13bc2eb97c
node -v 檢測node版本
條件:
node >=8.9
1.全局安裝 npm install -g @vue/cli?
2.查看版本/是否安裝成功 vue -V
3.在新文件夾下創(chuàng)建項(xiàng)目 vue create 你的項(xiàng)目名
按鍵盤上下鍵可以選擇默認(rèn)(default)還是手動(Manually),如果選擇default片拍,一路回車執(zhí)行下去就行了
這里我根據(jù)自己的學(xué)習(xí)需求選擇手動
4.選擇配置,看個人項(xiàng)目需求
注意封字,空格鍵是選中與取消,A鍵是全選
Babel? 是一個工具鏈耍鬓,主要用于將 ECMAScript 2015+ 版本的代碼轉(zhuǎn)換為向后兼容的 JavaScript 語法阔籽,以便能夠運(yùn)行在當(dāng)前和舊版本的瀏覽器或其他環(huán)境中
TypeScript 支持使用 TypeScript 書寫源碼
Progressive Web App (PWA) Support PWA 支持。
Router 支持 vue-router 牲蜀。
Vuex 支持 vuex 笆制。
CSS Pre-processors 支持 CSS 預(yù)處理器。
Linter / Formatter 支持代碼風(fēng)格檢查和格式化涣达。
Unit Testing 支持單元測試在辆。
E2E Testing 支持 E2E 測試证薇。
這里我個人需要用到的是Babel、Router匆篓、Vuex浑度、CSS Pre-processors,因?yàn)楸救吮容^懶惰鸦概,不喜歡被eslint規(guī)范箩张,一般在項(xiàng)目中是直接使用vscode代碼格式化插件格式化,在正式的項(xiàng)目中還是推薦大家使用eslint
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, Router, Vuex, CSS Pre-processors? ? 這是我選擇的插件
? Use history mode for router? (Requires proper server setup for index fallback in production) Yes? ?這里是問我是不是使用history路由? ? vue-router有兩種模式窗市,hash模式和history模式 詳情可參考hash模式和history模式的區(qū)別
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): Less? ? ?我個人比較偏愛于使用less
? Where do you prefer placing config for Babel, PostCSS, ESLint, etc.? In dedicated config files? ? ? 問我這里把babel,postcss,eslint這些配置文件放哪先慷,這里隨便選,第一項(xiàng)是指獨(dú)立文件夾? 第二項(xiàng)是指放在package.json文件里面? ?我選擇放在獨(dú)立文件夾
? Save this as a preset for future projects? No? ? 是否作為模板下次使用? 我這個這么爛的模板? 我選擇否
創(chuàng)建成功? ?按提示? cd到創(chuàng)建的項(xiàng)目目錄下(重要谨设,以前我就是這么菜熟掂,忘記cd到項(xiàng)目目錄下就報錯了)
npm? run? serve? ?啟動就完事了