源码:https://github.com/oopxiajun/vue_nginx_dockerfile_docker-compose
docker-compose.yaml 内容
# cat docker-compose.yaml
version: '2'
services:
myvueweb:
build: .
ports:
- "3000:80"
image: myvueweb
nginx.conf
# cat nginx.conf
worker_processes auto;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
client_max_body_size 20m;
server {
listen 80;
server_name localhost;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}
Dockerfile 内容
# 设置基础镜像
FROM nginx:latest
# 定义作者
MAINTAINER oopxiajun <[email protected]>
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/ /usr/share/nginx/html/
COPY nginx.conf /etc/nginx/nginx.conf
RUN echo 'echo init ok!!'
启动
docker-compose -f docker-compose.yaml up --build -d
看看容器
# docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
d75fca406d3d myvueweb "nginx -g 'daemon ..." 17 minutes ago Up 17 minutes 0.0.0.0:3000->80/tcp myvue_myvueweb_1
看看镜像
# docker images
REPOSITORY TAG IMAGE ID CREATED SIZE
myvueweb latest 9c6bd8a60bbb 22 minutes ago 127 MB
访问网页
# curl http://192.168.134.129:3000
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><title>VuejsApp1</title><link href=/js/app.43e89baa.js rel=preload as=script><link href=/js/chunk-vendors.d9eb519d.js rel=preload as=script></head><body><noscript><strong>We're sorry but VuejsApp1 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/js/chunk-vendors.d9eb519d.js></script><script src=/js/app.43e89baa.js></script></body></html>
是不是简单到爆呀