docker构建前端项目的镜像 多种示例 写法

 本地编译后构建

      FROM nginx:latest
      COPY dist /usr/share/nginx/html
  
 

示例一

      FROM node:latest as builder
      WORKDIR /app
      COPY package.json .
      RUN npm install --registry=http://registry.npm.taobao.org
      COPY . .
      RUN npm run build
      FROM nginx:latest
      COPY nginx.conf /etc/nginx
      COPY --from=builder /app/build /usr/share/nginx/html
  
 

示例二

      FROM node:10-alpine
      ENV PROJECT_ENV production
      ENV NODE_ENV production
      # http-server 不变动也可以利用缓存
      RUN npm install -g http-server
      WORKDIR /code
      ADD package.json /code
      RUN npm install --production
      ADD . /code
      RUN npm run build
      EXPOSE 80
      CMD http-server ./public -p 80
  
 

  
 
 

示例三

      FROM node:10-alpine as builder
      ENV PROJECT_ENV production
      ENV NODE_ENV production
      # http-server 不变动也可以利用缓存
      WORKDIR /code
      ADD package.json /code
      RUN npm install --production
      ADD . /code
      # npm run uploadOss 是把静态资源上传至 oss 上的脚本文件
      RUN npm run build && npm run uploadOss
      # 选择更小体积的基础镜像
      FROM nginx:10-alpine
      COPY --from=builder code/public/index.html code/public/favicon.ico /usr/share/nginx/html/
      COPY --from=builder code/public/static /usr/share/nginx/html/static
  
 

  
 
 

示例四

      # node镜像仅仅是用来打包文件
      FROM node:alpine as builder
      ENV PROJECT_ENV production
      ENV NODE_ENV production
      COPY package*.json /app/
      WORKDIR /app
      RUN npm install --registry=https://registry.npm.taobao.org
      COPY . /app
      RUN npm run build
      # 选择更小体积的基础镜像
      FROM nginx:alpine
      COPY nginx.conf /etc/nginx/conf.d/default.conf
      COPY --from=builder /app/build /app/build
  
 

  
 
 

文章来源: fizzz.blog.csdn.net，作者：拿我格子衫来，版权归原作者所有，如需转载，请联系作者。

原文链接：fizzz.blog.csdn.net/article/details/106768149