一、安裝Node
https://nodejs.org/en 點此鏈接下載進行安裝,選擇穩(wěn)定版本

二、全局安裝 vue-cli3.0
npm install -g @vue/cli 如果之前有安裝需要先卸載掉低版本 npm uninstall vue-cli -g
三、創(chuàng)建項目
1、vue create vue-3.0 執(zhí)行該命令后出現(xiàn)兩個選項default (babel, eslint)默認預設配置 和Manually select features(手動選擇配置),這里我們選擇手動配置

然后回車進入配置選擇項
?? Babel
? TypeScript // 支持使用 TypeScript
? Progressive Web App (PWA) Support //支持漸進式web應用程序
? Router //路由管理器
? Vuex //支持 vuex
? CSS Pre-processors //CSS預處理
? Linter / Formatter // 代碼風格、格式校驗
? Unit Testing //單元測試
? E2E Testing //e2e自動化模擬

2、是否使用路由的 history 模式
Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n) //我們選擇是 Y
3、CSS Pre-processors css預處理 (我選擇Less)
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default):
Sass/SCSS (with dart-sass)
Sass/SCSS (with node-sass)
? Less
Stylus
4 、Pick a linter / formatter config: 選擇Eslint代碼驗證規(guī)則(我們選擇ESLint + Standard config 標準配置)
ESLint with error prevention only
ESLint + Airbnb config
? ESLint + Standard config
ESLint + Prettier
5、 Pick additional lint features: 選擇什么時候進行代碼規(guī)則檢測(我們選擇保存時進行檢查)
?? Lint on save // 保存時檢測
? Lint and fix on commit // fix和commit時候檢查
6 、Pick a unit testing solution: Unit Testing 單元測試(我們選擇Jest )
Mocha + Chai
? Jest
7、Where do you prefer placing config for Babel, ESLint, etc.?(您希望Babel, ESLint 配置的存放位置,我們選擇在專用的配置文件中)
In dedicated config files //在專用的配置文件中
In package.json //在package.json
8、Save this as a preset for future projects?(y/N) (是否保存配置 我們可以選擇Y ,保存后下次構(gòu)建項目的時候就可以直用這次的配置構(gòu)建項目)
9、構(gòu)建完成

10、進入vue-3.0,執(zhí)行npm run serve命令運行項目訪問http://localhost:8080/


END