98 lines
2.6 KiB
Docker
98 lines
2.6 KiB
Docker
# 构建阶段
|
|
FROM node:18-alpine as build-stage
|
|
|
|
# 切换 Alpine 镜像源为阿里云
|
|
RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.aliyun.com/g' /etc/apk/repositories
|
|
|
|
# 设置工作目录
|
|
WORKDIR /app
|
|
|
|
# 设置环境变量
|
|
ARG NODE_ENV=production
|
|
ENV NODE_ENV=${NODE_ENV}
|
|
|
|
# 添加构建时间戳，用于破除缓存
|
|
ARG BUILD_TIMESTAMP=$(date +%s)
|
|
ENV BUILD_TIMESTAMP=${BUILD_TIMESTAMP}
|
|
|
|
# 输出构建环境信息
|
|
RUN echo "Building for environment: ${NODE_ENV}"
|
|
RUN echo "Build timestamp: ${BUILD_TIMESTAMP}"
|
|
|
|
# 安装 pnpm
|
|
RUN npm install -g pnpm
|
|
|
|
# 设置 pnpm 镜像
|
|
RUN pnpm config set registry http://mirrors.cloud.tencent.com/npm/
|
|
|
|
# 复制依赖文件
|
|
COPY package.json ./
|
|
|
|
# 安装依赖
|
|
RUN pnpm install && \
|
|
echo "Installed dependencies:" && \
|
|
pnpm list -g
|
|
|
|
# 安装 webpack 和 babel 相关依赖以及 Ant Design 图标
|
|
RUN pnpm add -D webpack webpack-cli webpack-dev-server @babel/core @babel/preset-env babel-loader css-loader style-loader html-webpack-plugin vue-loader@17 @vue/compiler-sfc && \
|
|
pnpm add ant-design-vue@3 @ant-design/icons-vue vue@3 vue-router@4 vuex@4 axios
|
|
|
|
# 确保babel配置文件存在
|
|
RUN echo '{ "presets": ["@babel/preset-env"] }' > .babelrc
|
|
|
|
# 复制项目文件
|
|
COPY . .
|
|
|
|
# 创建或更新环境文件
|
|
RUN echo "VUE_APP_API_URL=${API_URL:-/api}" > .env.production
|
|
|
|
# 显示安装的依赖
|
|
RUN echo "Installed dependencies:" && pnpm list
|
|
|
|
# 构建应用
|
|
RUN pnpm run build
|
|
|
|
# 生产阶段
|
|
FROM nginx:stable-alpine as production-stage
|
|
|
|
# 安装基础工具
|
|
RUN apk add --no-cache bash curl
|
|
|
|
# 创建必要的目录并设置权限
|
|
RUN mkdir -p /var/cache/nginx/client_temp && \
|
|
mkdir -p /var/cache/nginx/proxy_temp && \
|
|
mkdir -p /var/cache/nginx/fastcgi_temp && \
|
|
mkdir -p /var/cache/nginx/uwsgi_temp && \
|
|
mkdir -p /var/cache/nginx/scgi_temp && \
|
|
mkdir -p /var/run && \
|
|
mkdir -p /usr/share/nginx/html
|
|
|
|
# 删除默认配置
|
|
RUN rm -f /etc/nginx/conf.d/default.conf
|
|
|
|
# 复制自定义nginx配置
|
|
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
|
|
|
# 复制构建文件
|
|
COPY --from=build-stage /app/dist /usr/share/nginx/html
|
|
|
|
# 设置权限 - 确保nginx用户可以访问所有需要的目录和文件
|
|
RUN chown -R nginx:nginx /var/cache/nginx && \
|
|
chown -R nginx:nginx /var/run && \
|
|
chown -R nginx:nginx /usr/share/nginx/html && \
|
|
chown -R nginx:nginx /etc/nginx/conf.d && \
|
|
touch /var/run/nginx.pid && \
|
|
chown nginx:nginx /var/run/nginx.pid && \
|
|
chmod -R 755 /var/cache/nginx && \
|
|
chmod -R 755 /var/run && \
|
|
chmod -R 755 /usr/share/nginx/html && \
|
|
chmod -R 755 /etc/nginx/conf.d
|
|
|
|
# 暴露端口
|
|
EXPOSE 80
|
|
|
|
# 使用root用户运行nginx
|
|
USER root
|
|
|
|
# 启动nginx
|
|
CMD ["nginx", "-g", "daemon off;"] |