Docker 构建前端项目镜像

标签：根目录   打开   资料   仓库   lin   其他   targe   push   cal   

参考资料：

1. Dockerfile reference
2. Docker CLI commands
3. Docker Hub

一、使用 Docker 构建前端项目镜像：

1. 下载安装 Docker Desktop (建议电脑内存 8G+ 使用 Docker)
2. 准备一个 React / Vue / 其他 项目
3. 在项目的根目录新建名为 Dockerfile 的文件 (语法请看参考资料1，不做拿来主义)
   
   Dockerfile 文件示例：
   

   FROM node:current-slim AS build
   COPY . /frontend
   WORKDIR /frontend
   RUN npm i --registry=https://registry.npm.taobao.org
   RUN npm run build
   
   FROM nginx
   COPY --from=build /frontend/<打包后的文件目录>/ /usr/share/nginx/html/
   

    

4. 打开终端运行 Docker build 命令构建镜像 （命令使用请看参考资料2）
   
   

   docker build -t name:tag .

   注意：name:tag name是你要构建的镜像名，tag可以设为版本号

5. 启动容器
   
   

   docker run -d -p 8080:80 name:tag

   注意：name:tag 是你构建镜像时设置的值，8080:80 代表 将本地的 8080 端口 映射到容器的 80 端口

6. 打开浏览器，访问 localhost:8080，页面正常，则成功。

二、上传到镜像仓库：

Push an image or a repository to a registry

Docker 构建前端项目镜像

标签：根目录   打开   资料   仓库   lin   其他   targe   push   cal   

原文地址：https://www.cnblogs.com/jserhub/p/12941318.html