一行命令解決Vue和React打包部署上線

咳咳咳噠噠噠發表於2018-10-14

1. 這不是標題黨

回想我們之前如何吧打包好的專案部署到伺服器中?有很多中方法可以實現,可以用ftp遠端登入,可以是第三方,可以是後臺幫我們前端程式設計師做好了配置;當然你也可以把打包好的專案扔給別人,然後自己去逍遙快活。
無論你之前怎麼去實現打包上線,看完這篇後你也可以在自己專案下實現一鍵部署專案上線。本文只針對Windows哦,Mac自帶scp!

2. 實現原理

其實就是我們通過windows下的pscp命令,在專案下寫一個.bat指令碼,並註冊全域性變數,就可以一鍵搞定專案部署。

3. 實現方式

1. windows使用者下載pscp下載地址傳送大門

下載後 ,建議將pscp.exe放到C:\WINDOWS\system32下面,語法與scp相同,下面是幾個有用的options。

-p 拷貝檔案的時候保留原始檔建立的時間。
-q 執行檔案拷貝時,不顯示任何提示訊息。
-r 拷貝整個目錄
-v 拷貝檔案時,顯示提示資訊。

2. pscp 用法

pscp [options] [user@]host:source target
例如: pscp -r -v public root@jyjvip.cn:/data/www/

3.在專案根目錄下新建 .bat 指令碼檔案

例如,我在自己的hexo部落格下新建 build.bat 檔案, 並注入一下內容

@echo off
echo ====================clean=====================
call hexo clean

echo ====================hexo generate =====================
call hexo g

call pscp -r -v public root@jyjvip.cn:/data/www/
echo ====================upload successful=====================
複製程式碼

想了解更多 bat 指令碼語法,請看以下傳送門

4. 把bat指令碼注入到Windows全域性變數

其實這句話意思就是,把上面的build.bat寫入到windows下的path中

例如:編輯path全域性變數,把 D:\zhangchong-myself\hexo-blog 注入進去,確定儲存。

退出後,在 IDE 的終端 輸入 build.bat 看到編譯成功,並且會讓輸入到遠端伺服器密碼,而後大功告成!!!

4. 總結

主要就是.bat指令碼這段程式碼, call 是bat語法,意思是按順序執行命令,當然 bat 還有很多高階語法,有興趣的童鞋可以進一步瞭解,你學會了嗎?

個人部落格:www.jyjvip.cn
GitHub: github.com/JakeVivit/h…

相關文章