在部署專案的過程中,以前一直都是在本地部署,然後通過xftp上傳打包好的檔案到伺服器上,這個過程太過於繁瑣。而現在就職的公司採用的是自動化部署的方案,在功能開發完後,將功能分支合併到master分支上,伺服器就會自動構建**。所以才有了學習自動化部署的想法。
本文中的一些概念、步驟,可能解釋的不是很清楚或者有錯誤,有任何問題、想法的還懇請矯正 :) 對於一些概念和命令等,在文件上查詢更好,所以在這裡就沒有對命令進行詳細的解釋。
前端專案往往會根據環境的不同而出現各種各樣的問題,並且在配置環境的過程中,大多情況下都很麻煩,所以使用docker作為專案執行的環境。
概念docker初用只需要了解映象、容器這兩個概念就足夠了。
安裝筆者是在ubuntu16.04的環境下安裝的,根據docker文件安裝步驟如下
複製**
$ curl -fssl | sudo apt-key add -
$ sudo add-apt-repository "deb [arch=amd64] $(lsb_release -cs) stable"
複製**
安裝成功後可以執行以下命令來判斷是否安裝成功
$ sudo docker run hello-world
複製**
若出現hello from docker等文字則安裝成功。
了解docker的操作
這裡以實際例子來構建乙個docker容器並且在伺服器上跑起來
$ docker pull nginx
複製**
$ docker image ls
repository tag image id created size
nginx latest 53f3fd8007f7 2 weeks ago 109mb
複製**
這時候我們就有了乙個nginx的映象,我們使用該映象來建立並執行乙個容器,然後在瀏覽器檢視該效果。
$ docker run -d -p 8081:80 --name mynginx nginx
複製**
其中,-d是指讓容器在後台執行,-p是進行埠對映,將伺服器的8081埠對映到容器內部的80埠,建立成功後會輸出一串字串表示建立成功,我們可以通過docker ps命令檢視容器是否正在執行
$ docker ps
container id image ... ports names
6dd4380ba708 nginx ... 0.0.0.0:8081->80/tcp mynginx
複製**
看到該容器資訊後,我們訪問伺服器的8081埠,就可以看到nginx的歡迎介面了。
如果訪問失敗的話,可以檢視租用伺服器的防火牆,檢視8081埠是否開放
實戰接下來,我們用nginx映象為基礎,修改該映象並建立乙個容器來執行乙個vue應用。
一、 首先我們建立乙個vue應用,先不進行修改,打包成名為dist的資料夾,然後在伺服器上建立乙個工作目錄用於測試,將打包後的檔案放到工作目錄中。
二、 接著我們對nginx映象進行修改。在docker中有兩種修改映象的方式:
# 使用該命令進入容器
$ docker run -it --name mynginx nginx /bin/bash
# 然後在容器內進行修改,修改後提交該映象,-m為說明資訊,username為你的使用者名稱
$ docker commit -m "update the nginx" [username]/nginx:v2
複製**
這種方式雖然簡單,但是不利於在團隊中使用,因為團隊中的人不知道你對該映象進行了什麼操作,所以我們使用第二種方案來修改映象
使用dockerfile來執行一串的命令對映象進行修改。首先我們建立乙個dockerfile並編寫
# from關鍵字:取決於基於什麼映象構建
from nginx
# 將打包好的檔案複製到容器中的該路徑下
copy dist/ /usr/share/nginx/html/
# 將修改的檔案替換掉容器中的nginx配置
copy default.conf /etc/nginx/conf.d/default.conf
複製**
default.conf內容如下
server
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
# error_page 500 502 503 504 /50x.html;
location = /50x.html
}複製**
三、 將檔案都準備好後,我們構建該映象並且建立、執行容器
# 要在dockerfile所在路徑下執行該命令,並且注意後面有個"."
$ docker build -t="[username]/mynginx" .
# 構建成功後,我們使用該映象來執行容器
$ docker run -it -d -p 3000:80 [username]/mynginx
複製**
在docker篇中,我們知道了如何使用docker去部署乙個應用。使用docker部署應用的好處在於,不論你是在windows還是在mac上編寫docker,應用所處於的執行環境都是一樣的,在伺服器上你不需要重新部署一遍環境,減少了我們的工作量。
最後,如果本文有什麼錯誤之處,懇請指正。
前端自動化部署方案 實踐(配合shell)
以下例項專案為vue專案,其他專案當然也雷同咯 在專案中建乙個這個麼指令碼檔案 不說了,上 bin sh handle 1 env 2 遠端部署機 webhook 如果用遠端機器部署的話就要用到以下方法 prehandle 清空dist目錄 emptyremotedist 傳送檔案到正式服 tran...
mysql自動化部署方案 什麼是自動化部署?
自動化部署將可交付產品,快速且安全地交付使用者使用的一套系統和工具。系統會自動構建 測試並準備 變更,以便將其發布到指定環境的過程,包括開發環境 預發布環境 生產環境等。自動化部署工具介紹 簡要介紹 該工具是資料庫自動化部署調優工具,支援mysql 8.0.17 8.0.18和postgresql ...
Jenkins SVN 前端自動化部署
jenkins是什麼?昨天之前我也不知道。習慣上班之前刷刷新聞或技術相關知識 了解到jenkins。其實就是乙個自動打包自動部署的乙個工具,不過感覺挺好玩的。我比較菜好了一天多的時間才弄好。如果你也想用那就用吧反正一聽自動化就感覺挺高大上的 jenkins svn win vue專案 和別的軟體一樣...