FROM node:20-slim as base
ENV PROJECT_DIR=/huaxin-front  \
    PNPM_HOME="/pnpm" \
    PATH="$PNPM_HOME:$PATH"
WORKDIR $PROJECT_DIR
COPY ./ $PROJECT_DIR

# 若网络不通，可以使用淘宝源
# RUN pnpm config set registry https://registry.npmmirror.com
# 若不存在安装pnpm
RUN npm install -g pnpm

# 构建项目
# 安装生成依赖
FROM base AS prod-deps
RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile 

# 基于prod-deps生成的依赖执行构建
FROM base AS builder
## 不适用rimraf,因为rimraf是开发环境依赖

COPY --from=prod-deps $PROJECT_DIR/node_modules $PROJECT_DIR/node_modules
# 构建项目 VITE_BASE_URL=/ 为了静态资源assets中文件的路径正确 去掉/api
ENV VITE_BASE_URL=/
RUN pnpm run build
# # 将prod-deps生成的依赖拷贝到base/$PROJECT_DIR中,开始在builder构建阶段build,最后拷贝build生成的dist到base/$PROJECT_DIR中
# FROM base AS result



# 构建nginx,并且在result之后拷贝dist到nginx中，其中包含了自定义nginx.conf,
FROM nginx:alpine as production
ENV PROJECT_DIR=/huaxin-front
COPY --from=builder $PROJECT_DIR/dist/ /usr/share/nginx/html
COPY --from=builder $PROJECT_DIR/nginx.conf /etc/nginx/nginx.conf
EXPOSE 80