vue3.0 vue/cil4.0搭建

VUE3.0 搭建

更新Vue CLI

//卸載
npm uninstall -g vue-cli
//安裝 目前版本4.5.4
npm install -g @vue/cli

創建應用

vue create vue3.0

選項

Default ([Vue 2] babel, eslint)   　　　　　　　　　　　　　　　  //vue2版本默認
Default (Vue 3 Preview) ([Vue 3] babel, eslint)  　　　　  　 //vue3版本默認 
Manually select features   　　　　　　　　　　　　　　　　　　　　//選擇自定義創建

 ◉ Choose Vue version                                //選擇版本
 ◉ Babel                                             //Babel
 ◯ TypeScript                                        //ts使用
 ◯ Progressive Web App (PWA) Support       　　　　　　//創建為web應用
 ◯ Router                                            //創建Router
 ◯ Vuex                                              //創建vuex
 ◯ CSS Pre-processors                                //使用css預處理器
 ◉ Linter / Formatter                                //選擇規范類型
 ◯ Unit Testing                                      //選擇Unit測試方式
 ◯ E2E Testing                                       //選擇E2E測試方式
//我這個只選擇了TS VUEX CSS ROUTER
//版本選擇 3.x

• Use class-style component syntax? 是否使用class-style？ 這個我其他文章有介紹
• Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? 是否使用JSX格式？   如果有需要就使用，我就不用了
• Use history mode for router? 對路由器使用歷史記錄模式么？ 官方文檔有描述history模式，我僅做練習，不使用。
• CSS預處理我選擇Less，這個看個人。
• 然后是幾種ES檢查模式，我選擇ESLint with error prevention only。

? Pick additional lint features: (Press <space> to select, <a> to toggle all, <i
> to invert selection)
 ◉ Lint on save    　　　　　　　　　　//保存就檢測
❯◯ Lint and fix on commit　　　　　　 //fix和commit的時候檢測　　

目錄結構