docker项目部署

Posted 计划是动力

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了docker项目部署相关的知识,希望对你有一定的参考价值。

docker项目部署

1. vue项目docker部署

linux如何查看当前目录的完整路径

pwd

安装nginx镜像

docker pull nginx

vue项目打包

如果packa.json里面是这样的,执行下面的打包命令

npm run build

如果packa.json里面是这样的,执行下面的打包命令

npm run build:prod

之后vue项目会生成dist文件夹

docker部署方式一:挂载(适用于要经常修改的情况)

创建项目vueapp
在项目根目录下创建 nginx 文件夹,该文件夹下新建文件 default.conf:

server 


    listen       80;
    server_name  localhost;
    
    #charset koi8-r;
    access_log  /var/log/nginx/host.access.log  main;
    error_log  /var/log/nginx/error.log  error;
    location / 
        root   /usr/share/nginx/html;
        index  index.html index.htm;    
        
    
    #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;
    

直接基于 Nginx 镜像来启动容器 vueapp
创建启动脚本

vi vueapp.sh
docker run \\
-di --name vueapp \\
-p 9526:80 \\
 -v /root/vueapp/nginx:/etc/nginx/conf.d \\
-v /root/vueapp/dist:/usr/share/nginx/html \\
nginx

启动docker服务

sh vueapp.sh

这样就能每次修改了 Nginx 配置或者重新构建了 Vue 应用的时候,只需重启容器就能立马生效

docker部署方式二:COPY(适用于修改少的情况)

创建 Dockerfile 文件

vi Dockerfile

写入下面的语句

FROM nginx
MAINTAINER robert
COPY dist/ /usr/share/nginx/html/ 
COPY nginx/default.conf /etc/nginx/conf.d/default.conf

docker创建容器

docker build -t vueapp .

docker运行服务

docker run -d --name vueapp -p 9526:80 nginx

以上是关于docker项目部署的主要内容,如果未能解决你的问题,请参考以下文章

docker部署react项目

本地Docker部署SpringBoot项目

docker项目部署

docker项目部署

Docker部署项目完全使用指南

大项目docker打包部署慢