84 lines
2.6 KiB
Docker
84 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
|
||
|
||
# 设置环境变量
|
||
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}"
|
||
|
||
# 安装 yarn
|
||
RUN apk add --no-cache yarn
|
||
|
||
# 设置 yarn 和 npm 镜像源为淘宝源
|
||
RUN yarn config set registry https://registry.npmmirror.com && \
|
||
npm config set registry https://registry.npmmirror.com
|
||
|
||
# 设置工作目录
|
||
WORKDIR /app
|
||
|
||
# 复制 package.json 和 yarn.lock
|
||
COPY package.json yarn.lock* ./
|
||
|
||
# 安装所有依赖，包括开发依赖，并确保webpack相关依赖已安装
|
||
RUN yarn install --frozen-lockfile --production=false && \
|
||
yarn add dotenv@16.3.1 --exact && \
|
||
yarn add webpack webpack-cli vue-loader @vue/compiler-sfc html-webpack-plugin css-loader style-loader babel-loader --dev
|
||
|
||
# 复制项目文件
|
||
COPY . .
|
||
|
||
# 创建或更新环境文件
|
||
RUN echo "NODE_ENV=${NODE_ENV}" > .env && \
|
||
echo "BUILD_TIMESTAMP=${BUILD_TIMESTAMP}" >> .env && \
|
||
if [ "$NODE_ENV" = "production" ]; then \
|
||
echo "VUE_APP_API_URL=https://api.beefast.co" >> .env; \
|
||
elif [ "$NODE_ENV" = "testing" ]; then \
|
||
echo "VUE_APP_API_URL=https://api-dev.beefast.co" >> .env; \
|
||
else \
|
||
echo "VUE_APP_API_URL=http://localhost:8000" >> .env; \
|
||
fi && \
|
||
cat .env
|
||
|
||
# 根据环境变量选择构建命令
|
||
RUN if [ "$NODE_ENV" = "production" ]; then \
|
||
echo "Running production build" && \
|
||
npx --yes webpack --mode production; \
|
||
elif [ "$NODE_ENV" = "testing" ]; then \
|
||
echo "Running testing build" && \
|
||
npx --yes webpack --mode development --env testing; \
|
||
else \
|
||
echo "Running development build" && \
|
||
npx --yes webpack --mode development; \
|
||
fi
|
||
|
||
# 生产阶段
|
||
FROM nginx:stable-alpine as production-stage
|
||
|
||
# 切换 Alpine 镜像源为阿里云
|
||
RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.aliyun.com/g' /etc/apk/repositories
|
||
|
||
# 复制构建结果到Nginx目录
|
||
COPY --from=build-stage /app/dist /usr/share/nginx/html
|
||
|
||
# 复制Nginx配置文件
|
||
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||
|
||
# 添加构建信息文件，用于验证部署
|
||
RUN echo "Build completed at: $(date)" > /usr/share/nginx/html/build-info.txt && \
|
||
echo "Environment: ${NODE_ENV}" >> /usr/share/nginx/html/build-info.txt
|
||
|
||
# 暴露80端口
|
||
EXPOSE 80
|
||
|
||
# 启动Nginx
|
||
CMD ["nginx", "-g", "daemon off;"] |