Docker+Nginx+Vue部署

这里就不讲述Vue的安装和编写了

第一步打包项目：

• 把Vue项目打包：
  npm run build
• 你会看到一个dist文件夹，只需要将这个dist文件夹放到远程服务器上

第二步新建nginx.conf文件：

    listen 80;

    location / {
    root /usr/share/nginx/html;
    index index.html;

    }
}

server {
     location / {
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header Host      $http_host;
                proxy_set_header X-NginX-Proxy true;

                proxy_pass    http://127.0.0.1:5000;
                # proxy_redirect off;
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        }


}

• TIP:这里包含前端和后端的配置

第三步：新建Dockerfile文件

FROM nginx:latest
MAINTAINER dormancypress"jmt.com"
COPY ./nginx.conf /etc/nginx/conf.d/default.conf
COPY ./dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx","-g","daemon off;"]

第四步：新建一个文件，把这些放进去

第五步：将这个文件放到服务器上

• 进入该目录运行Dockerfile
• $docker build -t 项目名:版本 . /
• 镜像生成后可以使用 $docker images -a来查看镜像
• 使用 $docker run -p 8888:80 -t -i 项目名:版本 /bin/bash`来运行脚本
• 如果NGINX没有自动 启动，可以使用 $service nginx restart
• 最终 Ctrl+p ctrl+q 以挂起的形式退出