序: 百度翻了一遍, 沒有一個適合前端的自動化部署教程, 什麼配置服務器, 配置nginx代理服務等等, 對純前端非常不友好;
本文教程也同樣適合後端閱讀;
本文提及的github,gitlab是通用的, 均使用webhook觸發器;
目錄
一. 什麼是自動化部署
傳統部署前端網頁的做法的是把代碼丟給運維或者後端, 亦或者通過FTP工具把代碼丟到服務器中, 這裏暫且定個名字這種操作叫手動化部署;
相反的就是自動化部署,顧名思義代碼自動部署到服務器中;
二.爲什麼要做自動化部署
隨着前端工程項目越來越多, 這些手動操作就顯得尤其繁瑣, 讓代碼自己丟進服務器的操作能節省前端開發很多時間, 這樣就可以專心碼代碼, 拒絕做搬運工;
三. 學習前要做的準備
具體實現前, 先介紹一下要使用什麼:
1.jenkins
Jenkins是一款開源CI&CD軟件, 用於自動化各種任務, 包括構建、測試和部署軟件;
jenkins 下載地址: https://www.jenkins.io/zh/
2.服務器
後端都有服務器, 但是前端就不一定了;
沒有服務器怎麼辦?買一個平時也用不着, 就拿自己電腦當服務器吧.
因爲CSDN不能寫搭建本地服務器教程, 自行百度下: 內網穿透
實現內網穿透即可把本地計算機當服務器了;
四. 自動化部署流程
簡單來講就是當代碼推送到github, github就會給服務器發送指令, 告訴服務器我更新啦, 服務器就進行代碼打包部署的這麼一個操作;
jenkins安裝就不寫了, 網上有
jenkins安裝教程: https://www.cnblogs.com/longpizi/p/10690781.html
這裏食用整個自動化部署最重要的配置教程:
1. jenkins配置
1.配置新建任務
2.配置項目信息
3.和github的項目代碼做關聯, 這樣運行jenkins任務的時候就會去github下拉最新的代碼
4.祕鑰在你的個人用戶的.ssh文件夾裏面
添加到全局的私鑰
5.然後選擇剛纔添加的證書
6.接下來是構建觸發器, 選擇github的webhook當觸發器
7.構建環境不需要選
8.構建是執行命令, 不用完全按照我的, 我這裏是前端框架所以要安裝依賴包再打包, 然後拿到打包的dish文件移動到服務器;思路就是從github拉過來的代碼, 變成你服務器最終要的代碼, 然後丟到服務器中.
如果構建執行報錯 java.io.IOException: Cannot run program “sh”, 參考文章: https://blog.csdn.net/qq_40259641/article/details/106190598
9.構建後的操作可有可無, 我這裏是做了任務構建後發送結果到郵箱
構建後email操作參考文章:https://www.cnblogs.com/imyalost/p/8781759.html
2. 內網穿透配置:
3. webhook配置
1.打開你的項目>設置>webhooks
2.然後下拉到底部有個Recent Deliveries, 是測試能否連通你的數據庫地址用的
最後推送新的代碼到github, 看看已經實現自動化部署了
純前端自動化部署就完成了, 如果有什麼疑問留言看到都會回覆;
如果覺得文章不錯請點個贊吧,碼字不易轉載請註明來源謝謝.