使用dockerfile能力构建制品并打包容器
以常见的vue项目为例，使用如下Dockerfile
# 第一阶段：构建应用
FROM node:18.18.1 AS builder
WORKDIR /app
# 复制package.json和package-lock.json到容器中（如果需要）
COPY package*.json ./
# 安装依赖
RUN npm install
# 复制源代码到容器中
COPY . .
# 执行构建命令
RUN npm run build:dev# 第二阶段：部署到Nginx
FROM nginx:latest
# 清理默认的Nginx配置文件
#RUN rm -f /etc/nginx/conf.d/default.conf
# 如果需要，可以将自定义的Nginx配置文件复制进来
# COPY nginx.conf /etc/nginx/conf.d/
# 将Nginx的默认网站根目录设置为刚刚构建的应用
COPY --from=builder /app/dist /usr/share/nginx/html
# 暴露80端口
EXPOSE 80
# 启动Nginx服务
CMD ["nginx", "-g", "daemon off;"]若代码使用的包管理器为pnpm,可修改第一阶段的构建过程，yarn同理
# 第一阶段：构建应用
FROM node:18.18.1 AS builderWORKDIR /app# 安装pnpm
RUN npm install -g pnpm# 复制package.json和pnpm-lock.yaml到容器中
COPY package*.json pnpm-lock.yaml ./# 使用pnpm安装依赖
RUN pnpm install# 复制源代码到容器中
COPY . .# 执行构建命令
RUN pnpm run build:dev第二阶段一样。
之前写过一篇jenkins部署nodejs前端项目_jenkins nodejs-CSDN博客，需要在jenkins所在服务器上安装npm pnpm，将构建过程集成到docker后，jenkins只需要安装docker就可以了。