前置作業安裝

node
vue
vue-cli

vue-cli(Vue.js Command-Line Interface)

• 快速搭建專案的指令
• 內建Hot-Reload、ES Lint 與 dev-Server...
• 整合了webpack
  -> 立即建立可用的專案、環境

創建指令: vue create [project_name]

vue create hello-world

-> 選擇版本: 這裡選擇 [Vue 2] babel, eslint
->安裝完成後cd進目錄

cd hello-world

-> 啟動方式

// vue 3
yarn serve

->啟動測試: http://localhost:8080

Vue Devtools

vue專屬除錯工具，可透過Chrome擴充安裝
https://devtools.vuejs.org/guide/installation.html

且可透過發者模式查看

• Components:查看、調整組件，可做測試。
• Vuex:全域參數個狀態。
• Events:各事件及其來源。
• Routing:路由的變化。
• Performance:效能檢視。
• Setting、Refresh

有錯誤請不吝指教!
參考資料
https://book.vue.tw/CH3/3-1-vue-cli-introduction.html
https://zhuanlan.zhihu.com/p/68278113