Docker-compose 打包項目一鍵部署

【導讀】本文介紹了 docker compose 一鍵打包部署項目的實踐。

一、前言

我們常常見到很多比較棒的開源項目，但在本地安裝運行的話就會很複雜，要配置不同的環境，安裝不同的依賴，好一點的會用 docker 直接拉取，或者打包好。

這些無疑都會增加初學者上手的成本，所以這篇文章總結了下目前比較常用的解決方法之一：

使用 docker-compose 同時管理多個服務，只需要一行命令docker compose up -d，就可以啓動一個包含後端項目、前端項目、數據庫的完整服務。

而docker-compose作爲docker容器的編排工具，可以幫助我們實現管理多個docker容器。

其實整體的過程並不難，但要配置完成，也要很多步驟，這篇文章主要是從實戰的角度，將整個過程串起來。涉及的知識點包括：nginx、docker、docker-compose、node、mysql 也需要了解下。

適合讀下去的朋友：

需要提前準備的：

如圖所示，通過 docker-componse.yml 文件一次啓動不同的容器，然後他們都可以對外提供服務。

二、前端項目構建

1、前端項目處理

首先我們通過 CRA 下載一個項目模版，爲了可以模擬實際的項目需要，對下載的模版做一些處理，讓這個項目可以

接着我們打包yarn build:prod，打包後的文件夾build就是我們要部署的靜態資源。

在前面工程化實踐過程中提過相關內容，如果有問題可以參考下

2、拉取 Nginx 鏡像部署

我們通過 Docker 部署前面打包的靜態資源

當前項目的路徑是 /Users/user/Desktop/mine/fronted-demo2/build

直接運行下面命令行，啓動前端服務

docker run -d -p 80:80 -v /Users/user/Desktop/mine/fronted-demo2/build:/usr/share/nginx/html --name frontend-test nginx

通過本機 80 端口訪問，發現當前服務是生產環境，並且由於後端服務沒有部署，此時數據庫拿到的數據爲空。

測試，我們切換路由，發現頁面 404 了，是因爲單頁面應用路由在前端，需要 nginx 轉發下，接着我們用項目中的 Nginx 配置覆蓋容器中的配置

3、提取 Nginx 配置到項目中

首先，我們進入上一步的 Docker 容器，可以看到 Nginx 的路徑。

docker exec -it frontend-test /bin/bash

在項目根目錄下新建nginx/default.conf

server {
    listen  80;
    server_name  localhost;
    underscores_in_headers  on;
    root /home/frontend;
    location / {
      try_files $uri $uri/ @router;
      index index.html;
    }
    location @router {
      rewrite ^.*$ /index.html last;
    }
}

然後通過掛載的方式，啓動容器，發現訪問正常。

4、編寫 Dockerfile 文件

FROM nginx

WORKDIR /home/frontend

COPY build .

COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf

EXPOSE 80

在項目根目錄下，新建 Dockerfile 文件，其中包括基礎鏡像、工作目錄、將項目 copy 到鏡像，將 Nginx 配置文件複製到鏡像中。

5、構建前端服務鏡像並啓動

docker build -t frontend .

docker images

docker run -d -p 80:80 --name frontend-v1 frontend

可以發現前端服務的鏡像已經打包完成並啓動，打開本地 80 端口訪問，測試完畢可以刪除，然後留鏡像frontend備用。也可以將鏡像推送鏡像倉庫，後面直接通過遠程來拉取也可以。

主意：如果之前的 Docker 容器啓動，需要先關掉，否則會報端口被佔用，如果不刪除，就需要修改重新啓動容器的名字。

三、數據庫啓動

1、拉取並啓動數據庫、連接數據庫

docker run -p 3306:3306 --restart=always --privileged=true --name mysql -v /Users/user/Desktop/mysql/data:/var/lib/mysql -v /Users/user/Desktop/mysql/my.cnf:/etc/mysql/my.cnf -e MYSQL_ROOT_PASSWORD="123456" -d mariadb

一行命令啓動 Mariadb，這裏選擇 Mariadb 是由於我 m1 的電腦，不支持 mysql 鏡像，所以改成了 Mariadb，使用是一樣。上面的命令除了啓動數據庫服務，還設置了數據的一些配置，密碼，將數據庫的數據放在了本地。

[mysqld]
skip-name-resolve
user=root
character-set-server=utf8
default_authentication_plugin=mysql_native_password
sql_mode=ONLY_FULL_GROUP_BY,STRICT_TRANS_TABLES,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION
lower_case_table_names=1 #忽略表名大小寫

[client]
default-character-set=utf8
[mysql]
default-character-set=utf8

2、新建庫和表

這裏可以進入容器中操作數據庫，還可以使用客戶端連接數據庫

四、後端項目啓動

1、下載 Express 項目模版並連接數據庫

這裏配置數據庫，寫好項目接口，確保本地啓動服務正常。

2、拉起鏡像，部署鏡像

部署服務，我們選擇使用 pm2，爲了區分生產環境和預發環境，我們在根目錄下新建pm2.config.js，然後通過傳入不同的參數，啓動對應的環境

module.exports = {
  apps : [
      {
        name: "myapp",
        script: "./bin/www",
        watch: true,
        env: {
            "NODE_ENV": "development"
        },
        env_production: {
            "NODE_ENV": "production",
        }
      }
  ]
}

啓動預發環境pm2 start pm2.config.js --env development

啓動生產環境pm2 start pm2.config.js --env production

再項目中通過process.env.NODE_ENV讀取

3、編寫 Dockerfile 並構建新的鏡像

FROM keymetrics/pm2

RUN mkdir -p /home/backend

WORKDIR /home/backend

轉自：

juejin.cn/post/6981207521994211359

Go 開發大全

參與維護一個非常全面的 Go 開源技術資源庫。日常分享 Go, 雲原生、k8s、Docker 和微服務方面的技術文章和行業動態。

本文由 Readfog 進行 AMP 轉碼，版權歸原作者所有。
來源：https://mp.weixin.qq.com/s/ZWe3hopDoz3ARvpeDfb5gw

猜你喜歡