docker部署Vue应用

概述

二、vue静态文件生成

-在vue工程目录下执行命令:

node build/build.js

命令执行成功后,会在当前目录产生dist文件夹,将dist文件夹拷贝到ubuntu虚拟机中。

三、准备Dockerfile和nginx.conf

  • Dockerfile:
FROM nginx
COPY nginx.conf /etc/nginx/nginx.conf
COPY dist/ /usr/vuejs/nginx/
  • nginx.conf :
worker_processes  1;
events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
 
    sendfile        on;
    keepalive_timeout  65;
 
    server {
        listen       11000;
        server_name  localhost;
        root /usr/vuejs/nginx/;
        index index.html;
       
        location ~^/usersrv[/\w*]*$ {
            proxy_pass http://192.168.10.12:3000; // 服务地址
        }
    }
}

四、制作docker镜像

docker build -t imageName:v1.0 .

五、启动docker镜像

docker run --name ContainerName -p 11000:11000 -d  imageName:v1.0  

查看是否运行成功:
浏览器打开:http://localhost:11000

六、镜像、容器管理

  • 查看镜像
    docker images
  • 删除镜像
    docker rmi imageId
  • 查看容器
    docker ps
  • 停止容器
    docker stop containerId
  • 刪除容器
    docker rm containerId

你可能感兴趣的:(前端开发)