error_page 404 index.html; }#和上面vue文件对应上,访问后端都加mr-api#这里看情况,有的vue项目访问后端接口不需要代理location /mr-api {#rewrite ^/rest/(.*) /$1 break;proxy_pass http://192.168.1.113:8081;#proxy_cookie_path / /rest;proxy_redirect off;#client_max_body_size 500m;#proxy_se...
③创建需要映射进去的文件 vim /root/zscDemo/vueDemo/aiecp/conf/nginx.conf 讲配置好的 conf 文件粘贴进去 ④运行nginx docker run --name aiecp -d -p 80:80 --restart=always --privileged=true -v /root/zscDemo/vueDemo/aiecp/conf/nginx.conf:/etc/nginx/nginx.conf -v /root/zscDemo/vueDemo...
docker restart nginx 三. vue-element-admin落地项目线上部署 完成上面的Nginx安装和相关配置后,接下来开始部署前端项目。 youlai-mall-admin是开源项目有来商城分离的管理前端,基于vue-element-admin基础框架构建的。这里讲述如何将其部署到线上环境。 1. 项目打包 执行npm run build:prod打包项目,打包生成的文件在...
1、拉取nginx镜像。 2、打包Vue项目 3、使用Docker run一个nginx容器(将其目录资源挂载到主机!!) 3、使用打包好的Vue项目资源替换nginx资源 nginx的运行资源目录是有一定要求的,因此要想跑起来的是自己的Vue项目,就需要将nginx下的原始资源换成我们的Vue项目资源,再用docker里的容器将这个换好的nginx跑起来。 1....
确保vue项目能正常运行 将vue项目编译 编写Dockerfile文件 使用docker build命令生成镜像 使用docker run命令生成容器 二、具体详解 1.确保docker环境能够正常运行 linux安装docker环境:以CenterOS为例,参考CentOS Docker 安装 | 菜鸟教程 使用官方安装脚本自动安装 ...
用vue cli 创建一个vue项目,修改一下创建出来的项目,在页面上写一个前端接口请求,构建一版线上资源 ,基于nginx docker镜像构建成一个前端工程镜像,然后基于这个前端工程镜像,启动一个容器 vuenginxcontainer。 启动一个基于 node 镜像的容器 nodewebserver,提供后端接口。
e-1、安装vue脚手架 sudo cnpm install -g vue-cli e-2、安装项目依赖 cnpm install e-3、安装 vue 路由模块vue-router和网络请求模块vue-resource cnpm install vue-router vue-resource --save e-4、启动项目 npm run dev或cnpm run dev 二、将vue项目部署到docker nginx并实现访问 ...
1.安装好 nginx 。 2. 把 vue 项目的源码克隆到确定目录下。用 git 管理,所以直接 git clone 到既定目录就行了。 如我的目录是:/root/jiangyu/projects/gentle_vue/gentle_vue_code 。 3. 项目打包: 代码语言:javascript 复制 npm run build
docker build -t vue_index:1 . ps:只是简单的部署,主要是nginx部署转发后端。 二、启动 1、查看docker images 2、启动后端容器:docker run -it -d -p 8000:8000 -v /data/web:/web web:1 -d:容器后台启动 -p:宿主机端口映射容器端口 -v:挂载文件夹,在宿主机查看日志方便 ...
部署过程:略 前端:vue docker端口:9876 映射宿主机端口:8081 宿主机IP: 172.20.10.100 部署方式:使用带nginx服务的docker发布 1、准备镜像,并先启动一个镜像实例 # docker pull nginx # docker run -d --name nginx -p 8081:9876 nginx 2、下载相关配置文件,准备修改 ...