現(xiàn)在的 vue 腳手架已經(jīng)升級到4.0的版本了,前兩日vue 剛發(fā)布了3.0版本,我看了一下cli 4 和cli 3 沒什么區(qū)別,既然這樣,就只總結一下vue cli 4 的項目搭建吧,回顧一下。
1. 創(chuàng)建項目
對應的命令:vue create 項目名
2. 手動選擇配置選項
這里我們一般選擇手動配置

這里一般我們選擇手動配置
3.選擇需要的依賴
在這里插入圖片描述
這里的話按住空格就是選擇,全選的話就是按住a
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>( ) Babel //轉碼器,可以將ES6代碼轉為ES5代碼,從而在現(xiàn)有環(huán)境執(zhí)行。
( ) TypeScript// TypeScript是一個JavaScript(后綴.js)的超集(后綴.ts)包含并擴展了 JavaScript 的語法,需要被編譯輸出為 JavaScript在瀏覽器運行
( ) Progressive Web App (PWA) Support// 漸進式Web應用程序
( ) Router // vue-router(vue路由)
( ) Vuex // vuex(vue的狀態(tài)管理模式)
( ) CSS Pre-processors // CSS 預處理器(如:less、sass)
( ) Linter / Formatter // 代碼風格檢查和格式化(如:ESlint)
( ) Unit Testing // 單元測試(unit tests)
( ) E2E Testing // e2e(end to end) 測試
4. 選擇是否使用history router模式
Vue-Router 利用了瀏覽器自身的hash 模式和 history 模式的特性來實現(xiàn)前端路由(通過調用瀏覽器提供的接口)。 我這里建議選n。這樣打包出來丟到服務器上可以直接使用了,后期要用的話,也可以自己再開起來。 選yes的話需要服務器那邊再進行設置。Use history mode for router? (Requires proper server setup for index fallback in production)

選擇是否使用history router模式
5. 選擇css 預處理器

選擇css 預處理器
6. 選擇Eslint 代碼驗證規(guī)則

選擇Eslint 代碼驗證規(guī)則
6.2 選擇什么時候進行檢測

選擇什么時候進行檢測
7.選擇單元測試
這個需要根據(jù)自己的情況而定
選擇單元測試
8.選擇如何存放配置
這個一般都是獨立放置,這樣后期可以更方便的更改。選擇如何存放配置
9.選擇是否保存當前的配置
一般我是不保存的,因為根據(jù)項目的不同,相應的配置也會不同
選擇是否保存當前的配置
10. 等待創(chuàng)建項目中

等待創(chuàng)建項目中
創(chuàng)建成功
11. 成功后就可以訪問了

在這里插入圖片描述

在這里插入圖片描述