Docker部署nginx+vue项目并运行
一、打包VUE项目
npm run build:prod
二、编写default.conf 文件
server { listen 80; server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { root /usr/share/nginx/html; try_files $uri $uri/ /index.html; index index.html index.htm; } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root /usr/share/nginx/html; } }
三、编写Dockerfile文件
# 使用nginx镜像 FROM nginx # 作者 MAINTAINER hy # 删除nginx 默认配置 RUN rm /etc/nginx/conf.d/default.conf # 添加我们自己的配置 default.conf 在下面 ADD default.conf /etc/nginx/conf.d/ # 把刚才生成dist文件夹下的文件copy到nginx下面去 COPY dist/ /usr/share/nginx/html/
四、将以上文件全部移到服务期同一目录下
五、创建镜像
docker build -t xxx . //xxx为自定义镜像名称
六、运行镜像的一个容器
docker run -d -p 80:80 --name xxx xxx //8086是宿主机端口 80是容器内端口
七、查看是否运行成功
docker ps -a |grep xxx
八、我们每次改完代码 需要先把之前的容器停了 然后又要重新buid run 比较麻烦 ,所以我们可以写一个脚本
#!/bin/bash
sudo docker stop xxx //xxx 容器名称
sudo docker rm xxx //xxx 容器名称
sudo docker build -t xxx . //xxx 镜像名称
sudo docker run -d -p 80:80 --name xxx xxx //xxx容器 xxx镜像
直接执行./xx.sh就行了
长风破浪会有时,直挂云帆济沧海