Vue 環境準備
用Vue開發網站前，來依序安裝開發IDE、Server、Chrome套件，依序如下：
# 開發IDE採用「Visual Studio Code,簡稱 vscode」，安裝Url:「https://go.microsoft.com/fwlink/?LinkID=623230」
打開VSCode的「Extension」畫面，按照下面列表，依序輸入下面所列的套件名稱，進行安裝，安裝完畢後，重開vscode，安裝便完畢
| 套件名稱 | 套件用途 | 套件vs market 的網址 |
| vetur | vue tools,提供智慧選字,就不用怕忘記vue的指令 | https://marketplace.visualstudio.com/items?itemName=octref.vetur |
| beautify | 程式碼格式化套件 | https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify |
| ESLint | 程式碼檢核 | https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint |
| Path Intellisense | 在import時，可以自動顯示檔案路徑 | https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense |
| vscode-great-icons | vscode開發工具,文件圖標擴展 | https://marketplace.visualstudio.com/items?itemName=emmanuelbeziat.vscode-great-icons |
# 環境則會用以「node.js」當作本地開發Server，安裝url:「https://nodejs.org/dist/v7.10.0/node-v7.10.0-x64.msi」
# Chrome開發工具
| 軟體用途 | 安裝路徑 |
| Vue DevTools 開發工具 | https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?utm_source=chrome-ntp-icon |
| 觀看LocalStorage套件 | https://chrome.google.com/webstore/detail/html5-storage-manager-all/giompennnhheakjcnobejbnjgbbkmdnd?hl=en-US |
| JSON Editor 格式化 | https://chrome.google.com/webstore/detail/json-editor/lhkmoheomjbkfloacpgllgjcamhihfaj?utm_source=chrome-ntp-icon |
下篇介紹vue-cli安裝及新建立專案，待續.........