docker部署vue项目的实现步骤

 更新时间:2023年07月28日 11:48:45   作者:天津魔嵌动力张毫洁  
本文主要介绍了docker部署vue项目的实现步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

材料

1.打包好的vue的dist文件夹

2.docker环境

运行环境结构图

  • dist:打包的项目
  • default.conf: nginx的配置文件
gzip on; #开启或关闭gzip on off
gzip_disable "msie6";
gzip_buffers 4 16k; 
gzip_comp_level 8; 
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
server {
    listen       8086;
    server_name  localhost;
    #charset koi8-r;
    access_log  /var/log/nginx/host.access.log  main;
    error_log  /var/log/nginx/error.log  error;
    location / {
        add_header 'Access-Control-Allow-Headers' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS'; 
        add_header 'Access-Control-Allow-Origin' '*';
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }
    #error_page  404              /404.html;
    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

Dockerfile:docker运行命令配置文件

FROM nginx:latest
COPY dist/  /usr/share/nginx/html/
COPY default.conf /etc/nginx/conf.d/default.conf

说明书内容

1.构建镜像:

docker build -t vue-app .

2.运行镜像:

docker run -d -p 8011:8086 --name vue-container vue-app

浏览地址:本地ip+8011

3.一定要有网没网的话先要构建一个离线的nginx镜像

docker save -o和docker load -i是Docker命令,用于将Docker镜像保存到文件和加载镜像文件到Docker中。下面我会解释这两个命令的作用和用法。

docker save -o命令:

docker save -o <output_file.tar> <image_name:tag>

这个命令用于将指定的Docker镜像保存到一个输出文件中。<output_file.tar>是你希望保存镜像的文件路径和名称,例如my_image.tar。<image_name:tag>是要保存的Docker镜像的名称和标签,例如ubuntu:latest。

例如:docker save -o my_image.tar ubuntu:latest

docker load -i命令:

docker load -i <input_file.tar>

这个命令用于从一个输入文件中加载Docker镜像到Docker中。<input_file.tar>是包含要加载的镜像的文件路径和名称,例如my_image.tar。

例如:docker load -i my_image.tar

使用这两个命令可以方便地将Docker镜像导出到文件并在其他机器或环境中加载。请注意,在使用docker load -i命令加载镜像之前,确保在目标机器上已经安装了Docker,并且有足够的权限来加载镜像。

到此这篇关于docker部署vue项目的实现步骤的文章就介绍到这了,更多相关docker部署vue内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 用Docker搭建nextcloud个人网盘教程

    用Docker搭建nextcloud个人网盘教程

    大家好,本篇文章主要讲的是用Docker搭建nextcloud个人网盘教程,感兴趣的同学赶快来看一看吧,对你有帮助的话记得收藏一下
    2021-12-12
  • Docker compose up -d与Docker restart的区别

    Docker compose up -d与Docker restart的区别

    本文主要介绍了Docker compose up -d与Docker restart的区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-07-07
  • 如何完全清理你的Docker数据

    如何完全清理你的Docker数据

    Docker 不会对你的系统进行任何配置更改……但是它会占用大量的磁盘空间,那么如何完全清理你的数据,本文就详细的来介绍一下,感兴趣的可以了解一下
    2021-07-07
  • docker常用命令汇总

    docker常用命令汇总

    这篇文章主要介绍了docker常用命令汇总,都是一些常用的基本命令,有需要的同学可以尝试学习下
    2020-12-12
  • centos7更改docker仓库的方法

    centos7更改docker仓库的方法

    这篇文章主要介绍了centos7更改docker仓库的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07
  • harbor修改配置文件后重启操作

    harbor修改配置文件后重启操作

    这篇文章主要介绍了harbor修改配置文件后重启操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • docker版es、milvus、minio启动命令详解

    docker版es、milvus、minio启动命令详解

    这篇文章主要介绍了docker版es、milvus、minio启动命令详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • Docker打印和配置环境变量的命令详解

    Docker打印和配置环境变量的命令详解

    在现代应用开发中,Docker 提供了一种有效的容器化解决方案,使得应用的部署、扩展和管理变得更加灵活,环境变量在容器化应用中起着重要作用,它们可以帮助配置应用的运行环境,本文给大家介绍了在 Docker 容器中打印和配置环境变量,需要的朋友可以参考下
    2024-10-10
  • Docker进阶之快速扩容的方法

    Docker进阶之快速扩容的方法

    这篇文章主要介绍了Docker进阶之快速扩容的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-08-08
  • docker启动jar包输出日志的问题以及解决

    docker启动jar包输出日志的问题以及解决

    这篇文章主要介绍了docker启动jar包输出日志的问题以及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-08-08

最新评论