環境準備
這裏我們就直接使用官方推薦的Vue CLI方式
CLI (
@vue/cli) 是一個全局安裝的 npm 包，提供了終端裏的vue命令。它可以通過vue create快速創建一個新項目的腳手架，或者直接通過vue serve構建新想法的原型。CLI 服務 (
@vue/cli-service) 是一個開發環境依賴。它是一個 npm 包，局部安裝在每個@vue/cli創建的項目中。CLI 服務是構建於 webpack 和 webpack-dev-server 之上的。它包含了：
- 加載其它 CLI 插件的核心服務；
- 一個針對絕大部分應用優化過的內部的 webpack 配置；
- 項目內部的
vue-cli-service命令，提供serve、build和inspect命令。
1.你首先需要安裝node.js，自行下載安裝即可。
Vue CLI 的包名稱由
vue-cli改成了@vue/cli。 如果你已經全局安裝了舊版本的vue-cli(1.x 或 2.x)，你需要先通過npm uninstall vue-cli -g卸載它。Vue CLI 需要 Node.js 8.9 或更高版本 (推薦 8.11.0+)。
2. 安裝Vue CLI 3
npm install -g @vue/cli
3. 查看版本
Microsoft Windows [版本 6.1.7601] 版權所有 (c) 2009 Microsoft Corporation。保留所有權利。 C:\Windows\System32>node --version v8.11.1 C:\Windows\System32>vue --version 3.0.1 C:\Windows\System32>
安裝方法一（通過命令）
1. 打開cmd
2. 創建工程
vue create hello-world
3. 選擇配置
第一個是默認配置，非常適合快速創建一個新項目的原型；
選擇之後就直接安裝了，等待即可。
第二個手動設置則提供了更多的選項，它們是面向生產的項目更加需要的。比如你可以選擇Router-路由
按空格進行選擇/取消，按回車確定，然後出現如下
問你是否使用路由模型，輸入Y回車，出現
回車，出現
繼續回車，出現【問你吧Babel，PostCSS，ESLint等等的配置放在哪裏】
我們選擇第二個，出現【問你是否把這個配置保存，以備未來的項目複用】
N，回車，就開始安裝了【這個只是演示了一下手動設置，練習的話就直接用默認的就可以】
==================彩蛋==================
後來我再次運行這個腳本，發現有三個選項了
因爲我在上面手動配置的最後（Save this as a preset for future projects?(y/N)）選擇了y，然後起名爲a。所以之後再建立工程，就會出現咱們自定義的這個選項。
==================彩蛋==================
4.運行
$ cd hello-world
$ npm run serve
5. 打包
$ cd hello-world
$ npm run build
根目錄會出現一個dist文件夾
安裝方法二 （通過Webstorm）
1. 打開Webstorm
2. 建立新工程
3. 選擇Vue.js
4. 下一步【這裏比命令行多了一個選擇：包含路由的配置、默認配置、手動配置】
5. Next，直接建立工程
工程建立好，目錄是這樣的
6. 調出npm命令面板【右鍵package.json】
面板裏包含運行和打包的命令
=============================
也可以通過Webstorm打開我們前面建立的helloworld工程
..
安裝到此爲止