Docker 通过Nginx镜像部署Vue项目
2017-10-11 10:17
1271 查看
下载Nginx image
编写Dockerfile
部署运行
为了演示我这边新建一个项目
可以看到这里dist文件夹中已经包含我们要发布的东西了
注意:把Dockerfile 和 default.conf 放到刚才项目的根目录下
vue-docker 文件结构:
如上部署就全部完成
浏览器输入 http://localhost:9000 即可看到运行结果
编写Dockerfile
部署运行
为了演示我这边新建一个项目
# cd vue-docker # cnpm install //等待安装 # cnpm run build //build打包发布文件
可以看到这里dist文件夹中已经包含我们要发布的东西了
开始准备Docker发布
我这里使用hub163中的镜像下载nginx镜像
# docker pull hub.c.163.com/library/nginx
编写Dockerfile
FROM hub.c.163.com/library/nginx //使用Nginx MAINTAINER Jounghu <1358199510@qq.com> //作者 RUN rm /etc/nginx/conf.d/default.conf //删除nginx 默认配置 ADD default.conf /etc/nginx/conf.d/ //添加我们自己的配置 default.conf 在下面 COPY dist/ /usr/share/nginx/html/ //把刚才生成dist文件夹下的文件copy到nginx下面去
default.conf:
server { listen 9000; //这里使用项目中的端口号 server_name localhost; #charset koi8-r; #access_log /var/log/nginx/log/host.access.log main; 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 html; } # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # #location ~ \.php$ { # proxy_pass http://127.0.0.1; #} # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 # #location ~ \.php$ { # root html; # fastcgi_pass 127.0.0.1:9000; # fastcgi_index index.php; # fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name; # include fastcgi_params; #} # deny access to .htaccess files, if Apache's document root # concurs with nginx's one # #location ~ /\.ht { # deny all; #} }
注意:把Dockerfile 和 default.conf 放到刚才项目的根目录下
vue-docker 文件结构:
├── build ├── config ├── default.conf ├── dist ├── Dockerfile ├── index.html ├── node_modules ├── package.json ├── README.md ├── src └── static
Docker打包
# docker build -t vue-docker .
运行
# docker run -d -p 9000:9000 vue-docker
查看运行结果
# docker ps
如上部署就全部完成
浏览器输入 http://localhost:9000 即可看到运行结果
写在后面
本人也是初学阶段,如有错误,欢迎指正。谢谢大家。相关文章推荐
- 【容器技术】Docker镜像 + nginx 部署Vue项目
- 新手超详细记录:Docker for Windows打包制作tomcat镜像并部署java web项目
- nginx部署vue项目
- 从零开始通过idea插件将一个spring boot项目部署到docker容器里运行
- CENTOS6.4上面通过NGINX部署DJANGO项目的简要记录
- linux+docker+nginx+tomcat部署web项目
- 详解vue通过NGINX部署在子目录或者二级目录实践
- Vue-router+webpack单页项目服务器部署(nginx)
- Docker 部署 SpringBoot 项目整合 Redis 镜像做访问计数Demo
- 利用nginx docker 镜像 部署静态页面
- Docker 学习笔记1—创建一个docker nginx镜像并通过浏览器访问
- linux下通过Nginx部署django项目
- 如何使用Docker部署一个web项目并打包成镜像文件
- marathon部署docker的nginx镜像失败,容器一直提示Exit(0)解决方法
- Docker 部署 SpringBoot 项目整合 Redis 镜像做访问计数示例代码
- JAVA项目如何通过Docker实现Jenkins持续部署
- nginx部署访问vue-cli搭建的项目的方法
- Django学习笔记五:通过nginx+uwsgi部署Django项目(暂时静态文件没有部署上去)
- nginx部署访问vue-cli搭建的项目
- nginx部署vue项目