docker部署vue前端

1.下载安装nginx image

docker pull nginx:latest

2.准备将编译后的代码上传到主机上

3.编写dockerfile, nginx conf,并创建镜像

Dockerfile

FROM nginx:latest
MAINTAINER hzh
 
RUN rm /etc/nginx/conf.d/default.conf
ADD default.conf /etc/nginx/conf.d/
 
COPY www/  /var/www/frontend/

default.conf

server {
   listen       ;
   server_name  localhost;
   charset      utf-;
   root   /var/www/frontend/dist/;
   index  index.html;
   error_page   = /index.html;
}
 
也可这样写

server {
　　listen 80;
　　server_name localhost;
　　charset utf-8;
　　error_page 404 = /index.html;

　　location / {
　　　　root /var/www/frontend/dist/;
　　　　index index.html index.htm;
　　}
}

在此目录下执行生成镜像

docker build -t hzh/mapboxvue:v1 .

4.运行容器

docker run --name ngintest -p 80:80 -d hzh/mapboxvue:v1