Docker 命令 & 构建前端项目镜像

Docker 命令

构建镜像

docker build -t name:tag .

运行容器

docker run -d -p port:port --name name name:tag

查看镜像

docker images

移除镜像

docker rmi imagesID...

查看容器

docker container ls
# 或
docker ps -a

停止容器

docker container stop name

启动容器

docker container start name

移除容器

docker container rm name

发布容器

docker tag demo:v0.0.1 18001700016/demo:v0.0.1

docker push 18001700016/demo:v0.0.1

---

Docker 构建前端项目镜像

参考资料：

1. Dockerfile reference
2. Docker CLI commands
3. Docker Hub
4. 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, 注意：以下的命令都是在 Dockerfile 所在的目录下执行）

   docker build -t name:tag .
   # 例：docker build -t demo:v0.0.1 .
   
   # 注意：name:tag  其中 name 是你要构建的镜像名，tag 可设为版本号。最后的 . 代表你当前目录
   

5. 启动容器

   docker run -d -p 8080:80 --name name name:tag
   # 例：docker run -d -p 8080:80 --name demo demo:v0.0.1
   
   # 注意：
   # name:tag 是你构建镜像时设置的镜像名和标签
   # 8080:80 代表 将本地的 8080 端口 映射到容器的 80 端口
   # --name name 代表给你启动的容器起个名字
   

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

上传到镜像仓库：Push an image or a repository to a registry

1. tag the image

   docker tag name:tag Repository:tag
   # 例：docker tag demo:v0.0.1 18001700016/demo:v0.0.1
   
   # 注意：name:tag 是你构建镜像时设置的镜像名和标签，Repository:tag  Repository 代表仓库地址, tag 可设为版本号
   

2. push the image to the registry

   docker push Repository:tag
   # 例：docker push 18001700016/demo:v0.0.1
   
   # 注意：Repository:tag 是第一步设置的