【容器技术】Docker镜像 + nginx 部署Vue项目

如果使用docker部署思维要做转变,

以前:启动nginx或者tomcat,把打包的war或者是静态html丢在web服务器项目工程文件夹下

现在:项目还有项目需要依赖的tomact,nginx,还有其他环境,甚至是操作系统,其他等等,全部制作成一个镜像,任何一台电脑,只要安装了docker,都能直接运行这个镜像,发布你自己的工程,完全独立的虚拟环境

现在就以vue项目为例,基于docker镜像发布工程

由于vue编译过后是一段静态html的文件,要想使用,必须运行在http服务器(nginx,tomact,httpServer等等),本文就以nginx作为http服务器



六步走流程说明
第一步:vue项目打包 

node build/build.js
 生成文件格式如图


第二步:同目录下创建文件夹 Dockerfile,内容如下

#导入nginx镜像FROM nginx:1.13.7
MAINTAINER Guang Zhouguang <zhouguang@whruobei.com>
#把当前打包工程的html复制到虚拟地址
ADD ./app /usr/share/nginx/html
#使用自定义nginx.conf配置端口和监听
COPY nginx.conf /etc/nginx/nginx.conf

RUN /bin/bash -c 'echo init ok!!!'

第三步:创建nginx.config
worker_processes auto ;
#pid /usr/local/nginx/logs/nginx.pid;
#error_log /usr/local/nginx/logs/error.log crit;
worker_rlimit_nofile 1000000 ;

events {
worker_connections 65536 ;
multi_accept on ;
use epoll ;
}

http {
include mime.types ;
default_type application/octet-stream ;

sendfile on ;
tcp_nopush on ;
tcp_nodelay on ;
server_tokens off ;

keepalive_timeout 10 ;
client_header_timeout 10 ;
client_body_timeout 10 ;
reset_timedout_connection on ;
send_timeout 10 ;

limit_conn_zone $binary_remote_addr zone=addr:5m ;
limit_conn addr 100 ;

gzip on ;
gzip_disable "msie6"
gzip_static on ;
gzip_proxied any ;
gzip_min_length 1000 ;
gzip_comp_level 4 ;
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript ;

open_file_cache max=100000 inactive=20s ;
open_file_cache_valid 30s ;
open_file_cache_min_uses 2 ;
open_file_cache_errors on ;

# include /etc/nginx/conf.d/*.conf;
# include /etc/nginx/sites-enabled/*;

server {
listen 80 ;
# 接口服务的IP地址
server_name localhost ;
charset utf-8 ;
access_log off ;
# ElecManageSystem-应用文件夹名称 app-index.html页面所在文件夹
root /usr/share/nginx/html ;
location / {
index index.html index.htm ;
}

error_page 500 502 503 504 /50x.html ;
location = /50x.html {
root html ;
}
}
}

第四步:制作镜像  docker build -t rb:1 .



第五步:查看镜像(docker images),rb就是刚才创建的镜像了  




好了,这里镜像就执行成功了,接下来就可以运行镜像了,不管推送到哪儿,都可以直接用了,方便吧?

第六步:运行镜像



可以根据容器id 查看启动日志 

 docker logs d377fea6caa9




  • 3
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

源14

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值