1、docker安装nginx
docker pull nginx
docker run --name nginx -itd --restart always -p 8080:80 -v /usr/local/web/dist:/usr/share/nginx/html nginx
2、vue项目打包dist文件
npm run build
生成一个dist文件,将dist文件整个上传到服务器端 /usr/local/web下
3、在/usr/local/web 下新建一个Dockerfile文件:
vi Dockerfile
文件内容如下:
FROM nginx
COPY dist/ /usr/share/nginx/html/
COPY nginx/default.conf /etc/nginx/conf.d/default.conf
4、在/usr/local/web下新建一个文件夹nginx,命令如下:
mkdir nginx
cd nginx
vi default.conf
default.conf内容如下:
server {
listen 80;
server_name localhost;
#charset koi8-r;
access_log /var/log/nginx/host.access.log main;
error_log /var/log/nginx/error.log error;
location / {
root /usr/share/nginx/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;
}
}
5、回到web目录下:
运行如下命令:
docker build -t renren-vue .
docker run -p 8001:80 -d renren-vue
6、启动完成,可以在浏览器输入ip:8001查看