Docker部署Vue3项目

1、进入运行打包命令，npm run build 

1）进入package.json运行

2） 右上角配置过npm运行build

2、打包好的文件会在目录下生成dist文件，这就是打包好的资源

3、上传文件到服务器

4、构建按Dockerfile文件，并且放到和dist的同级目录下

FROM nginx
MAINTAINER  my-front
COPY /dist /usr/share/nginx/html

5、构建容器镜像，运行如下命令

docker build -t container-name .

 container-name 是你指定的镜像名称

构建好后就可以使用

docker images 查看刚刚创建的docker镜像

6、运行镜像文件

docker run -d \
--name=container-name \
-p 80:80  \
container-name

命令解析

-d 后台运行

--name 运行容器的名称

-p 端口映射  服务器端口：容器内应用端口

我们通过浏览器地址的访问形式是TCP协议，TCP协议默认的访问端口是80端口，如果你的端空映射不是80，那么在访问地址的时候需要你的端口号

上面运行完成后你就可以在浏览器的地址上面通过 协议 + ip地址 + 端口 的形式直接访问前端了