使用Docker完成前端部署

一 项目中创建Nginx文件夹，下创建nginx.conf

编写nginx.conf

events {
    worker_connections 1024; # 设置每个 worker 进程最大连接数
}

http {
    server {
        listen 80;

        # gzip config
        gzip on;
        gzip_min_length 1k;
        gzip_comp_level 9;
        gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml;
        gzip_vary on;
        gzip_disable "MSIE [1-6].";

        root /usr/share/nginx/html;
        include /etc/nginx/mime.types;

        location / {
            try_files $uri /index.html;
        }
    }
}

gzip on 启用 Gzip压缩功能

gzip_min_lengt 指定压缩的最小文件的大小

gzip_comp_leve 设置Gzip压缩的级别，1-9，9为最高压缩比，但会消耗更多的CPU资源

gzip_types 指定需要进行Gzip压缩的文件类型

gzip_vary on 在http响应头中添加Vary标头，以通知服务器根据Accept-Encoding来提供正确的压缩版本

gzip_disable "MSIE [1-6]." 禁用特定的浏览器压缩，在这里禁用了Internet Explorer 1至6版本的Gzip压缩。

二 项目中创建Dockerfile文件

FROM nginx
COPY dist/ /usr/share/nginx/html/
COPY Nginx/nginx.conf /etc/nginx/nginx.conf

FROM nginx 安装nginx

COPY 拷贝，从执行目录拷贝指定文件到容器中的指定目录

三 创建镜像

1. 将dist打包文件，Dockerfile，Nginx放在一个文件夹xxx内。

   进入xxx内，执行命令，后面.不要忽略。

   docker build -t xxx .
   

   这里 -t 标志用于指定镜像的名称，. 表示使用当前目录作为构建上下文。

   等待构建过程完成，此时会生成一个名为 xxx 的镜像。

2. 运行docker镜像

   1. 查看docker镜像
   docker images
   ​
   2. 通过以下命令来运行镜像并将容器与主机的端口进行映射
   docker run -d -p <host_port>:<container_port> xxx
   ​
   3. 查看容器状态
   docker ps
   
   4. 查看报错
   docker logs <container_id>
   

   将 <host_port> 替换为宿主机上希望暴露的端口号，而 <container_port> 则是之前在 Dockerfile 中指定的应用程序端口号。

现在，你就可以通过访问 http://localhost:{host_port} 或者 http://{your_ip}:{host_port} 来访问你的 Web 项目了！

四 镜像导出导入

1. 导出

   docker save -o xxx.tar xxx:latest
   

   将镜像保存为名为xxx.tar的文件。

2. 导入

   将导出的镜像文件复制到目标机器上，在目标机器上，使用以下命令导入镜像：

   docker load -i xxx.tar
   

   这将加载镜像并将其添加到目标机器的本地镜像列表中。