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文件

1 FROM nginx:latest
2 MAINTAINER dormancypress"jmt.com"
3 COPY ./nginx.conf /etc/nginx/conf.d/default.conf
4 COPY ./dist /usr/share/nginx/html
5 EXPOSE 80
6 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 以挂起的形式退出

 

posted @ 2020-04-09 10:54  如果云吃糖  阅读(573)  评论(0编辑  收藏  举报