docker安裝nginx並部署前端項目的全過程

Posted on by

1.簡介

本文主要介紹如何使用docker安裝nginx，以及如何將前端打包好的vue項目部署到nginx上。

2.操作

（1）拉取nginx鏡像：

docker pull nginx

（2）咱們先把docker鏡像跑起來：

docker run --name myNginx -p 80:80 -v /home/nginx/dist:/usr/share/nginx/html  -d nginx
 
 
## --name：容器名字
## -d: 要啟動的鏡像的名字
## -v: /home/nginx/dist 這是宿主機(服務器)中的目錄映射到nignx容器中的/usr/share/nginx/html中;

其實最讓人費解的就是-v這個東西，其實就是docker的文件映射。我自己的理解就是將宿主機與nginx鏡像中的目錄映射關聯起來，這樣的效果就是nginx鏡像中的目錄下的文件發生瞭什麼變化，與之映射的宿主機的目錄也會隨之變化，同理，當宿主機中的映射目錄下的文件發生變化，與之對應的nginx鏡像中的映射目錄也會有同樣的變化，二者的內容是保持一樣瞭，這樣的好處就是我們以後想改某個容器的配置文件的時候，不用再進入到容器內部去改瞭，咱直接在宿主機上改即可。

（3）上一步啟動容器的目的是想把容器中的一些目錄先拷貝到宿主中，上一個啟動命令並不是終極版的啟動命令，咱們還需要把nginx容器中的配置文件所在的目錄下的文件內容拷貝到宿主機中，讓這兩個目錄的原始內容先保持一致，廢話不多說，請看命令：

 docker cp 容器id:/etc/nginx /home/etc

咱們把nginx容器中的/etc/nginx下的內容拷貝到宿主機的/home/etc文件中，如果同學你的/home裡面沒有etc這個文件夾，可以提前建一個再來拷貝。

（4）好好好，這個nginx容器我已經利用完瞭，現在是時候拋棄它瞭，因為咱們的終極版nginx容器是不需要它瞭，運行下面的命令來把這個nginx容器幹掉(我真無情~哈哈)：

docker  rm   容器id

（5）做完上面的無情第四步之後，接下來是最重要的一步，我們要啟動nginx鏡像。

docker run --name myNginx -p 80:80  -v /home/nginx/dist:/usr/share/nginx/html -v 
 /home/etc/nginx:/etc/nginx -d  鏡像的id或者名字

解釋：啟動鏡像的時候，最重要的就是做好文件映射，這裡有兩個地方我們需要映射的，一個是nginx鏡像中的：/usr/share/nginx/html，這個目錄是用於放具體的vue前端項目的嘛，我們就用將它映射到宿主機(你的服務器)中的這個目錄: /home/nginx/dist；還有一個是nginx鏡像中的： /etc/nginx，這個目錄裡面有nginx的配置文件，咱們映射到宿主機：/home/etc/nginx裡面。映射瞭這個目錄以後，修改nginx的配置文件就可以不用再到容器裡面瞭，可以直接到宿主機的/home/etc/nginx裡面去修改nginx的配置文件。

（6）咱們繼續看看怎麼到宿主機上修改nginx的配置文件：

cd  /home/etc/nginx/conf.d

到這個目錄下，我們可以看到一個:  default.conf，是的，就是它，這個文件就是配置nginx的關鍵文件。

然後就是咱們build的前端項目隻要上傳到宿主機中的：  /home/nginx/dist裡面即可，就像下面這樣。

最後咱們可以重啟一下nginx容器，看看有沒有生效。訪問地址是：你的ip地址:80

3. 總結

廢話很多，最重要的就是要想提醒同學們要註意docker的文件映射，尤其docker的啟動命令中，不要看到很長就懶得仔細看，一股腦就復制到服務器上執行。好瞭，以上就是我的分享，如果有問題咱們評論區見~

到此這篇關於docker安裝nginx並部署前端項目的文章就介紹到這瞭,更多相關docker安裝nginx部署項目內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：