前天尤大正式從直播中詳細介紹了vue3.0來襲，回想過去經歷過1再到2.x版本，vue逐步的穩定的前進，為很大一批前端人提供了工作崗位，3.0來襲意味着諸位又要開啟一波學習，作為尤大鐵桿粉，我將最近每天抽時間分享一下3.0使用，廢話不多說。開始今天的重點也是該系列第一篇---通過cli搭建一個3.0項目。
Vue 項目初始化
第一步：安裝cli(已經安裝的人不需要安裝了)
相信很多人跟我一樣不喜歡用cli，而是自己喜歡寫webpack吧，不過由於本篇幅為給大部分人講解快速入手vue3，所以就沒有選擇自己的webpack，后面等整個系列結束可以分享一篇關於自己webpack搭建vue的文章。
npm install -g @vue/cli
mac需要加 sudo，安裝完成可以看到如下圖
我們可以使用
vue -V
查看版本（注意大寫V，或者使用--version）如果安裝成功會出現對應版本
新建項目
npm安裝vuecli完畢就可以正式的去新建項目了，我們輸入下面的命令
vue create vue-next-test
輸入完成之后會進入到這個界面，我們選擇Manually select features
我們在其中選擇我們需要的，如圖我選擇了常規項目中需要的一些
之后會出現下面的字符，這是詢問我們是否使用history路由，我們可以根據喜好選擇，我選擇是，輸入Y
Use history mode for router? (Requires proper server setup for index fallback in production)
回車，出現下面這段字符，這是詢問我們使用那種css預處理器，還是根據喜好選擇就行，我選擇Sass/SCSS (with dart-sass)，回車
Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported
by default): (Use arrow keys)
又出現了下面的這段 詢問我們選擇那種lint/formatter規則，我選擇ESLint with error prevention only（僅錯誤提示）
Pick a linter / formatter config: (Use arrow keys)
接下來出現詢問我們選擇語法檢查方式我們選擇 lint on save（保存就檢查）
Pick additional lint features: (Press <space> to select, <a> to toggle all, <i > to invert selection)
接下來出現詢問我們保存到哪，我選擇In dedicated config files（獨立config文件）
Where do you prefer placing config for Babel, ESLint, etc.?
最后會出現，詢問我們是否保存剛才的配置，我這就不保存了輸入n
Save this as a preset for future projects?
然后vue就會開始安裝了，等待即可
別急着高興，遠遠沒完事，下面我要告訴你一個不幸的消息，熟悉cli的同學應該都明白 這只是初始化vue2.x的一個正常流程，你可能想說，上面扯了那么多，你給我生成一個vue2.x干什么，首先我需要說明我沒在逗大家玩，Vue 3.0 項目目前需要從 Vue 2.0 項目升級而來，所以務必要先初始化一個vue2.x才行（或者你可以自己寫個命令讓他自動升級）
重頭戲：2.x升級3.0
兩行指令讓我們升級到3.0安裝官方推薦我們的 vue-cli-plugin-vue-next（git地址：https://github.com/vuejs/vue-cli-plugin-vue-next）
cd vue-next-test
vue add vue-next
等待一段時間安裝，這個期間說一下這個操作做了什么吧
- 安裝 3.0 依賴
- 更新 loader ，使其能夠支持新語法文件
- 創建 3.0 的模板
- 將 Vue Router 和 Vuex 升級到 4.0 版本
- 生成 Vue Router 和 Vuex 模板代碼
如上圖所示，我們升級成功了！看一下各個文件變化吧
先是package.json,我們可以看到增加了vue\vue-router\vuex如下所示
下一個變化是mainjs
包括router文件和vuex文件
尾聲：vue3.0已經來襲，技術不會等待我們，我們需要快速進階，在其還未全面鋪開之時，迅速掌握vue3，明天我將准備一個小的demo帶大家快速掌握composition api之雙向數據綁定，以及refs和reactive講解，另外本項目已經放到git，歡迎大家查看https://github.com/JinZhenZon/vue-next-test，注：本人也是一名普通前端，只會給大家一點點深入，因為我也需要一點點深入去了解，每天分享主題都是我臨時想到。不一定全面，歡迎大家給我提出意見，想要知道哪方面怎么寫可以留言我，我會盡量幫大家吧3.0完全過一遍。