最近在用react+express做一個(gè)自己的工具型網(wǎng)站（其實(shí)就是奪寶島搶拍器）

然后因?yàn)榻?jīng)常要改動(dòng)，而且又要放到服務(wù)器上進(jìn)行測試。總是要webpack，然后手動(dòng)把文件上傳上去，不勝其煩，索性搜索了下，直接寫個(gè)能檢測文件變化并自動(dòng)進(jìn)行上傳的腳本好了。

首先，我們使用npm 安裝兩個(gè)別人封裝好的模塊。

npm install ssh2-sftp-clientnpm install gaze

第一個(gè)模塊的作用是sftp上傳文件，

第二個(gè)模塊的作用就是監(jiān)聽文件變化了。當(dāng)然，你也可以采用node自帶fs模塊。

這兩個(gè)模塊的用法在這里：ssh2-sftp-client gaze

安裝好了以后，第一步就是監(jiān)聽文件的變化了，由于我的文件已經(jīng)使用webpack構(gòu)建好了，所以后面只是文件變化，不會(huì)有文件增加，所以這里只需要使用changed就可以了，其他的用法請(qǐng)參考上面的鏈接，都大同小異

gaze(['你的文件路徑/*.*','還可以使用數(shù)組的方式監(jiān)聽多個(gè)文件夾/app.js'], function(err, watcher) { let watched = this.watched(); //監(jiān)聽文件的變化 this.on('changed', (filepath) => { //romotePath是我文件的遠(yuǎn)程位置 let romotePath = '/root' + filepath.substr(15); //put為上傳文件的函數(shù)，下面會(huì)講  put(filepath,romotePath); console.log(filepath + ' was changed'); });}); 

然后就開始寫我們的上傳文件的函數(shù)

function put(localPath,romotePath){ let sftp = new Client(); sftp.connect({ host: '你的服務(wù)器地址', port: '端口，沒改過的話是22', username: '連接的用戶名', password: '密碼' }).then(() => { return sftp.put(localPath,romotePath); }).then(() =>{ console.log("上傳完成"); }).catch((err) => { console.log(err, 'catch error'); });}

好了，別忘了在我們的文件開始的地方可是要引入模塊的。

let Client = require('ssh2-sftp-client');let gaze = require('gaze');

接下來我們來實(shí)驗(yàn)一下。來到我們的文件夾webpack一下

果然可以看到已經(jīng)修改并且上傳完成了。上傳需要時(shí)間，請(qǐng)耐心等待。

來到我們的服務(wù)器，果然最近的修改時(shí)間已經(jīng)變成現(xiàn)在了。

從此以后我終于不用一個(gè)個(gè)上傳了。每次要修改直接。打開一個(gè)窗口開啟這個(gè)腳本，就可以愉快的編碼了。

以上所述是小編給大家介紹的利用nodejs監(jiān)控文件變化并使用sftp上傳到服務(wù)器，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)武林網(wǎng)之家網(wǎng)站的支持！