[手寫系列]使用axios封裝一個天氣預報的package,併發布至NPM
第一步
先初始化然後安裝依賴,我要用到axios處理非同步請求,所以要安裝axios
//初始化專案
npm init
//安裝axios
npm install -g http-sever
npm install -save axios
建議大家如果不能科學衝浪,把國內npm源換成淘寶源或者使用yarn.(而且科學衝浪還得開全域性,開了全域性還會卡,安裝緩慢,卡到一半出問題,說多了都是淚,因此建議直接更換源)
//直接換
npm config set registry https://registry.npm.taobao.org
//查詢當前源
npm config get registry
//還原回來
npm config set registry https://registry.npmjs.org/
第二步
按照axios的文件來,自己寫個模組並匯出
- 返回一個new Promise物件,當我使用這個匯出來的方法,
- 使用方法時直接使用then()和catch()就可以為所欲為對面的資料做出控制
const axios = require('axios')
function getWeather(city){
return new Promise((resolve,reject)=>{
axios.get(`自己去找個免費的天氣api=${encodeURI(city)}`)
.then( response => {
resolve(response.data)
})
.catch(e=>{reject('網路異常')})
})
}
module.exports = getWeather
測試一下:
新建個test.js
const getWeather = require('./index')
getWeather('北京')
.then(data => console.log(data))
.catch(e=> console.log(e))
node test.js
成功!
最後的最後
釋出到npm上
npm publish
好了現在只需要在你的專案環境下
npm install sunnyday
在你的檔案中引入sunnyday模組,然後再函式中輸入對應的城市名,即可得到天氣
下面是我的天氣模組釋出成功的連結
https://www.npmjs.com/package/sunnyday
相關文章
- angular5.0封裝underscore常用pipe併發布到npm全套流程Angular封裝NPM
- 從零搭建一個前端cli腳手架併發布到npm前端NPM
- 80行程式碼教你寫一個Webpack外掛併發布到npm行程WebNPM
- Vue-axios 封裝了一手好axios:)VueiOS封裝
- Vue Axios 的封裝使用VueiOS封裝
- 貢獻你的力量 開發一個Vue元件併發布到npmVue元件NPM
- 如何從0開發一個Vue元件庫併發布到npmVue元件NPM
- vue中使用axios的封裝VueiOS封裝
- 手寫一個composer並上傳發布
- 使用async await 封裝 axiosAI封裝iOS
- 使用 Webpack4.0 打包元件庫併發布到 npmWeb元件NPM
- vue中axios的使用與封裝VueiOS封裝
- 使用這個開源工具獲取本地天氣預報開源工具
- 如何建立React元件併發布到npm?React元件NPM
- axios封裝iOS封裝
- 封裝axios封裝iOS
- 請利用SAX編寫程式解析Yahoo的XML格式的天氣預報,獲取天氣預報——python學習筆記XMLPython筆記
- react native天氣預報React Native
- flutter天氣預報APPFlutterAPP
- 天氣預報API介面API
- 基於workerman-jsonrpc二次封裝的一個packageJSONRPC封裝Package
- 在 vue-cil 裡封裝一個簡單的 axiosVue封裝iOS
- 天氣預報查詢 API 提供個性化的天氣服務的設計思路API
- 使用 js 修飾器封裝 axiosJS封裝iOS
- axios封裝apiiOS封裝API
- Flutter實戰(一)寫一個天氣查詢的APPFlutterAPP
- Flutter實踐:天氣預報Flutter
- 開發chrome外掛入門-天氣預報Chrome
- 手寫axiosiOS
- 封裝axios請求封裝iOS
- axios的二次封裝iOS封裝
- 使用 Wttr.in 在你的終端中顯示天氣預報
- 查詢天氣預報網站網站
- 0828-T3 天氣預報
- 5.22 天氣預報系統 小
- Flutter實戰1 --- 寫一個天氣查詢的APPFlutterAPP
- Flutter實戰2 — 寫一個天氣查詢的APPFlutterAPP
- Flutter實戰(二)寫一個天氣查詢的APPFlutterAPP