vue 專案建置 - Frank0321/taiwan_reservoir GitHub Wiki
vue 專案建置
vue 建置專案的方式有兩種 :
這邊主要介紹以 cli 的方式來建置專案
環境確認
確認是否有安裝好以下的程式
- node
- yarn / gridsome
- git 可用 cmd 確認是否有安裝
$ node -v
$ yarn -v / $ gridsome -v
$ git -version
使用 cli 建置專案
Step 0
使用 cmd 的方式進行操作
- 移動到要建置專案的目錄
- 建置專案
$ cd playground //移動到平常放專案的地方
$ vue create my-project //my-project是自己取的專案名稱
Step 1 : Please pick a preset
- 選擇
Manually select features
Step 2 : Check the features needed for your project
建議選擇以下 :
- Babel
- Router
- Vuex
- CSS Pre-processors (你要用sass就要選起來)
- Linter / Formatter (多人協作的話,最好是選起來,統一大家程式碼)
Step 3 : Choose a version of Vue.js that you want to start the project with
- 選擇
2.x
,目前專案預計以 vue2 進行開發
Step 4 : Use history mode for router?
- 網頁的路徑要不要顯示
- 選擇
Y
Step 5 : Pick a CSS pre-processor
- 選擇
Sass/SCSS (with node-sass)
Step 6 : Pick a linter / formatter config
- 檢查與排版
- 選擇
ESLint + Prettier
Step 7 : Pick additional lint features
- 選擇
Lint on save
,儲存時就自動檢查排版
Pick a unit testing solution
- 如果在 Step2 有選擇 unit Testing,則會多這個選項
- 選擇 Jest
Step 8 : Where do you prefer placing config for Babel, ESLint, etc.?
- 選擇
In dedicated config files
- 全部都獨立的設定檔比較好管理
Step 9 : Save this as a preset for future projects?
- 將目前的建制方式儲存起來
- 選擇
N
,不確定日後會不會修改建置方式
待更新