# 构建阶段
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
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 if [ "${NODE_ENV}" = "production" ]; then \
        pnpm run build:prod; \
    elif [ "${NODE_ENV}" = "testing" ]; then \
        pnpm run build:test; \
    else \
        pnpm run build:dev; \
    fi

# 生产阶段
FROM nginx:stable-alpine as production-stage

# 安装基础工具
RUN apk add --no-cache bash curl net-tools iputils

# 创建必要的目录并设置权限
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

# 创建启动脚本
RUN echo '#!/bin/sh\n\
echo "=== 容器网络信息 ==="\n\
ip addr\n\
echo "=== Nginx 配置检查 ==="\n\
nginx -t\n\
echo "=== 启动 Nginx ==="\n\
nginx -g "daemon off;"\n\
' > /start.sh && chmod +x /start.sh

# 暴露端口
EXPOSE 80

# 使用root用户运行nginx
USER root

# 启动nginx
CMD ["/start.sh"]