dockerfile-配置前端

# 构建阶段
FROM node:lts-alpine as build-stage
WORKDIR /app

# 复制依赖清单,利用Docker缓存
COPY package.json ./
RUN npm install -g pnpm

# 跳过脚本执行,避免编译错误(前端项目必备)
RUN pnpm install --ignore-scripts

# 复制项目源码并构建
COPY . .
RUN pnpm run build

# 生产阶段:仅保留Nginx + 构建产物
FROM nginx:stable-alpine as production-stage

# 清理默认配置,使用自定义配置
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx_dev.conf /etc/nginx/conf.d/nginx.conf
COPY mime.types /etc/nginx/mime.types.custom

# 从构建阶段复制dist文件
COPY --from=build-stage /app/dist /usr/share/nginx/html

EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

其中的RUN pnpm run build 对应的是packagejson中的配置

package.json文件设置,如果是生产的就用 RUN pnpm run test

"scripts": {
    "build": "vue-tsc --noEmit & vite build --mode development",
    "serve": "vite",
    "dev": "vite",
    "test": "vue-tsc --noEmit & vite build --mode production",
    "preview": "vite preview",
    "build-only": "vite build",
    "type-check": "vue-tsc --noEmit",
    "lint:eslint": "eslint --cache \"src/**/*.{vue,ts,js}\" --fix",
    "lint:prettier": "prettier --write \"**/*.{js,cjs,ts,json,css,scss,vue,html,md}\"",
    "lint:stylelint": "stylelint --cache \"**/*.{css,scss,vue}\" --fix",
    "lint:lint-staged": "lint-staged",
    "lint": "npm run lint:eslint && npm run lint:prettier && npm run lint:stylelint",
    "preinstall": "npx only-allow pnpm",
    "prepare": "husky",
    "commit": "git-cz"
  },

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注