一、环境信息

代码地址：https://gitee.com/dukuan/demo-ui.git

构建命令：mvn clean package

Java 版本：jdk 1.8

构建镜像：registry.cn-hangzhou.aliyuncs.com/abroad_images/node:16.17.0-apline-cnpm

二、构建及容器化

1、在node01主机(10.0.0.21)下载源码

# 宿主机上创建项目目录

[root@node01 ~]# mkdir springcloud

# 下载源码

[root@k8s-node01 ~]# cd springcloud/

[root@k8s-node01 springcloud]# git clone https://gitee.com/dukuan/demo-ui.git

# 宿主机上创建缓存目录(如果上面做过此步骤可忽略)

[root@k8s-node01 springcloud]# mkdir -p /data/m2

2、在node01主机(10.0.0.21)启动临时容器，进行构建

# 启动临时容器

[root@node01 ~]# cd /root/springcloud

[root@k8s-node01 springcloud]# 

docker run -it --rm \

  -v /data/m2:/root/.m2 \

  -v "$(pwd)/demo-ui:/mnt" \

  registry.cn-hangzhou.aliyuncs.com/abroad_images/node:16.17.0-apline-cnpm sh

/ # cd /mnt/

/mnt # sed -i 's/"@vitejs\/plugin-vue": "^5.0.4"/"@vitejs\/plugin-vue": "^4.3.4"/' package.json

/mnt # sed -i 's/"vite": "^5.2.0"/"vite": "^4.4.9"/' package.json

/mnt # npm install --registry=https://registry.npmmirror.com

/mnt # npm run build

# 出现✓字样，代表成功

> demo-ui@0.0.0 build

> vite build

vite v4.5.9 building for production...

✓ 64 modules transformed.

dist/index.html                  0.45 kB │ gzip:  0.29 kB

dist/assets/index-819d4460.css   1.27 kB │ gzip:  0.65 kB

dist/assets/index-c04d2758.js   94.87 kB │ gzip: 37.59 kB

✓ built in 1.22s

# 检查宿主机目录

[root@k8s-node01 springcloud]# ll /root/springcloud/demo-ui/dist/

总用量 8

drwxr-xr-x 2 root root   57  3月 23 10:55 assets

-rw-r--r-- 1 root root  449  3月 23 10:55 index.html

-rw-r--r-- 1 root root 1497  3月 23 10:55 vite.svg

3、在node01主机(10.0.0.21)编写Dockfile文件

# 宿主机上同样查看，观察到已生成target目录
[root@k8s-node01 ~]# cd /root/springcloud/demo-ui/
[root@k8s-node01 demo-ui]# ll
总用量 80
drwxr-xr-x  3 root root    54  3月 23 10:55 dist
-rw-r--r--  1 root root   357  3月 23 10:54 index.html
drwxr-xr-x 43 root root  4096  3月 23 10:55 node_modules
-rw-r--r--  1 root root   335  3月 23 10:54 package.json
-rw-r--r--  1 root root 59193  3月 23 10:55 package-lock.json
drwxr-xr-x  2 root root    22  3月 23 10:54 public
-rw-r--r--  1 root root   440  3月 23 10:54 README.md
drwxr-xr-x  4 root root    85  3月 23 10:54 src
-rw-r--r--  1 root root   157  3月 23 10:54 vite.config.js
# 编写Dockfile文件
[root@k8s-node01 ~]# cd /root/springcloud/demo-ui/
[root@k8s-node01 demo-ui]# vim Dockerfile
# 基础镜像可以按需修改，可以更改为公司自有镜像
FROM registry.cn-hangzhou.aliyuncs.com/abroad_images/nginx:1.22.1-alpine3.17
# 复制文件
COPY dist /usr/share/nginx/html

5、在node01主机(10.0.0.21)构建镜像

[root@k8s-node01 demo-receive]# docker build -t registry.cn-hangzhou.aliyuncs.com/abroad_images/demo-ui:v0.0.1 .

# 上传镜像到阿里云仓库

[root@k8s-node01 demo-eureka]# docker push registry.cn-hangzhou.aliyuncs.com/abroad_images/demo-ui:v0.0.1