總結(jié)一下這兩天學(xué)(chao)習(xí)(xi)大腿們的項(xiàng)目源碼。
這兩天都是在關(guān)注nodejs熱更新部分,直接上心得吧。
熱更新主要就是三個(gè)插件,gulp,gulp-nodemon,browser-sync。
gulp,前端配置自動(dòng)化工具。
gulp-nodemon,重啟服務(wù)器的插件,我的理解應(yīng)該是gulp與nodemon的一個(gè)中間件吧,剛?cè)肟酉共碌?/em>。
browser-sync,顧名思義,瀏覽器同步更新插件。
首先,在package.json的script里添加一個(gè)server: gulp server的啟動(dòng)項(xiàng)。這樣就可以不用全局安裝gulp了。

然后創(chuàng)建gulpfile.js,引入必要的東西,gulp,gulp-nodemon,browser-sync,引入path庫(kù),用于路徑的合成。

接下來(lái)首先寫(xiě)一個(gè)啟動(dòng)的task。因?yàn)槲覀儐?dòng)的是server,就寫(xiě)一個(gè)server的task。這里有兩點(diǎn):
1、這個(gè)task依賴(lài)與browser-sync的task,雖然我們執(zhí)行的是server的task,但是因?yàn)橐蕾?lài)的關(guān)系,它會(huì)先執(zhí)行browser-sync的task,再執(zhí)行自己。
2、server的task里面有一個(gè)watch,用于監(jiān)聽(tīng)文件的變化,依賴(lài)bs-delay的task,每次watch到修改都會(huì)執(zhí)行bs-delay的task。

接著寫(xiě)server所依賴(lài)的browser-sync的task:
1、browser-sync的task依舊是有前置依賴(lài),執(zhí)行這個(gè)task前會(huì)先去搜尋nodemon這個(gè)task,nodemon這個(gè)task執(zhí)行完畢后,才會(huì)執(zhí)行browser-sync。
2、自己里邊是執(zhí)行了初始化browser-sync的瀏覽器熱更新插件。

這里配置默認(rèn)起的端口是3000,因?yàn)槭菂⒖夹缘难芯浚晕疫@里寫(xiě)需要被代理服務(wù)器參數(shù)時(shí)就直接把3000端口寫(xiě)了上去。
至于browser-sync有什么參數(shù)可以去官網(wǎng)的api里查詢(xún)。
然后再繼續(xù)探索一下上一個(gè)task的前置任務(wù),nodemon task:

啟動(dòng)nodemon用。沒(méi)什么好說(shuō)的,有興趣可以去看看nodemon的api:
大致就是這樣吧,這段代碼完成了以后就可以實(shí)現(xiàn)nodejs的熱更新了。