啟用一個 Vue Cli 並且 引用帶入專屬 API

先建置好router環境

安裝VUE-AXIOS來取得遠端資料(AJAX套件)，

先在終端機安裝npm install

npm install —save axios vue-axios

並用npm載入

import axios from 'axios' import VueAxios from 'vue-axios'

並加入 Vue.use(VueAxios, axios)

npm dun dev執行環境。

取得遠端資料，參考文件

this.$http.get(api).then((response) => {
	console.log(response.data)
})

可以看出api已經抓到

到confing

dev.env.js為開發環境

prod.env.js為正式環境

先將api取出加到開發環境，待要輸出時在加入開發環境

重起VUE CLI，終端機輸入npm run dev。

在console.log中輸入查詢路徑是否正確

https://vue-course-api.hexschool.io ，apple ⇒得到值正確

確認後可將api改為環境變數取得，這樣可以確保api更改路徑比較好更動