docker 前端中使用

下载地址

https://docs.docker.com/desktop/install/mac-install/

学dockder的目的
可以将vue项目打包为docker镜像运行
使用docker可以方便将其他人的项目直接运行，而不需要配置
1，将vue的项目进行构建，输出dist
这个步骤就相当于是将vue的项目 npm run build 打包到服务器是一样的
2，准备镜像内容
在dist目录之上新建一个Dockerfile文件，该文件没有后缀，文件名即为此，然后输入如下内容：

FROM nginx:latest //设置基础镜像，基础包镜像使用nginx
LABEL Author dj   //作者信息
COPY dist /usr/share/nginx/html  //将dist文件夹下面的内容拷贝到/usr/share/nginx/html 目录下面（nginx的默认项目路径）也就是我们vue项目打包之后我们正常使用nginx是拷贝过去的文件夹

3,制作镜像

docker build -t //镜像名字
# 比如
docker build -t vue3project
docker images //查看镜像是否制作好

注意：后面的，不能省略，镜像创建成功之后使用docker imges即可看到自己创建的镜像
整个制作过程大概为5分钟

在镜像工具里可以看到运行
4，启动镜像

docker run -d --name 镜像名字 -p 888:80 vue3project

docker类似线上的服务器
打包好的dist目录，平级下创建一个Dockerfile
里面写上配置内容

docker login 查看是否登录账号成功，在发布线上之前需要有账号

修改名字

docker tag xxx dj（作者名字）/镜像名字

在项目根目录下创建 Dockerfile

FROM node:18-alpine3.15
WORKDIR /egg
COPY package.json .
RUN npm install

.dockerignore
排队docker操作的内容

docker-compose.yml