CentOS@7.5

流程

git push到仓库
CI检测到GitHub代码有更新，自动打包出一个docker镜像更新至docker hub
CI编译完成后登录服务器，删掉原有容器，拉取新镜像并创建一个新容器

初始化项目

创建仓库
创建Travis账号并关联仓库
到docker hub注册账号并创建镜像仓库
Travis个人中心添加环境变量DOCKER_USERNAME和DOCKER_PASSWORD方便更新镜像
在项目根目录创建.travis.yml ```yaml language: node_js node_js:

"12" services:
docker

before_install:

npm install

script:

npm run build
echo "$DOCKER_PASSWORD" | docker login -u "$DOCKER_USERNAME" --password-stdin
docker build -t mrrs878/blog:latest .
docker push mrrs878/blog:latest ```

在项目根目录创建nginx.conf ```shell script server { listen 80; server_name localhost; location / { try_files $uri $uri/ /index.html; root /usr/share/nginx/html; index index.html index.htm; }

}

7. 在项目根目录创建`Dockerfile`
```shell script
FROM nginx

COPY ./build/ /usr/share/nginx/html/

RUN rm /etc/nginx/conf.d/default.conf

ADD nginx.conf /etc/nginx/conf.d/

EXPOSE 80

在项目根目录创建.dockerignore加快打包速度 ```shell script /.idea /node_modules /.pnp .pnp.js

/coverage

.DS_Store .env.local .env.development.local .env.test.local .env.production.local

npm-debug.log* yarn-debug.log* yarn-error.log*


# 编写代码push到仓库，Travis自动编译，等待编译完成

# 到[docker hub](https://hub.docker.com)查看镜像状态

# 服务器配置

1. `nginx`添加反向代理

```shell script
server {
        listen       80;
        server_name  blog.p18c.top;

        location / {
                proxy_pass   http://127.0.0.1:8081;
        }
}

更新镜像并创建容器

docker pull mrrs878/blog:latest
docker container stop blog
docker container rm blog
docker container create --name blog -p 8081:80 mrrs878/blog:latest
docker container start blog

Ref

写给前端的Docker实战教程

Docker-基于Travis、Github搭建CI&CD自动化部署之自动构建

流程

初始化项目

Ref