无论是本地的dev-api还是线上的prod-api的标识本质上都是解决前后端分离项目的跨域问题,只不过本地使用的vue的proxyTable代理,线上使用的是nginx的代理,手段则是统一的替换标识为真正的后端地址。 四. 结语 至此youlai-mall后端和前端都已部署完毕,线上网址www.youlai.store,目前上线的功能有系统管理模块和OAuth2统...
命令的意思是将项目根目录下 dist 文件夹下的所有文件复制到镜像中 /usr/share/nginx/html/ 目录下。 COPY default.conf /etc/nginx/conf.d/default.conf 命令的意思是将 Nginx 目录下的 default.conf 复制到 etc/nginx/conf.d/default.conf,用本地的 default.conf 配置来替换 Nginx 镜像里的默认配置。 2.2...
所有需要将docker容器中nginx文件挂载到宿主机上面。 ①新建nginx目录 ②复制nginx容器配置文件到宿主机上。(nginx容器须开启,运行状态) ③查看nginx.conf配置。nginx容器的nginx.conf挂载在宿主机上,以后修改下面配置文件就可以了。 ④关闭nginx 容器,删除nginx容器,重新启动挂载nginx指令。 首先关闭nginx容器,然后重新运...
用vue cli 创建一个vue项目,修改一下创建出来的项目,在页面上写一个前端接口请求,构建一版线上资源 ,基于nginx docker镜像构建成一个前端工程镜像,然后基于这个前端工程镜像,启动一个容器 vuenginxcontainer。 启动一个基于 node 镜像的容器 nodewebserver,提供后端接口。 修改vuenginxcontainer 的 nginx 配置,使前端...
在上一文中 通过IDEA集成Docker插件实现微服务的一键部署,但前后端分离的项目,除了后端微服务的部署之外,当然还少不了前端工程的部署。所以本篇讲述如何通过Docker安装Nginx实现前端Vue项目工程的部署。 一. 前言 在上一文中 传送门 通过IDEA集成Docker插件实现微服务的一键部署,但 youlai-mall ...
- /root/java_project/www.enshidai.com/nginx/nginx.conf:/etc/nginx/nginx.conf privileged: true # 这个必须要,解决nginx的文件调用的权限问题 mysql: image: mysql:5.7.27 ports: - 3306:3306 volumes: - /home/mysql/enshidai/data:/var/lib/mysql ...
一、vue项目编译打包 1、更新node更新库 2、编译打包 npm run build 该问题的原因是 之前项目代码是在windows环境编译的 现在是在mac环境编译 所以需要下载相应操作系统的编译库 编译成功之后 会生成一个dist文件夹 里面的内容就是即将部署到nginx的静态资源 ...
部署过程:略 前端: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、下载相关配置文件,准备修改 ...
docker pull nginx 查看本地镜像: docker image ls 启动Nginx // -i 以交互模式运行容器,通常与 -t 同时使用 // -t 为容器重新分配一个伪输入终端,通常与 -i 同时使用 // -p 参数将一个docker主机的端口映射到容器中 // -it 参数一般连用,在docker run 启动一个容器后提供一个容器的终端,如果容器...
前端项目打包 由于我需要在同一个端口号下使用nginx部署多个前端项目,所以需要额外设置一些东西。 修改vue.config.js文件 添加如下配置: router配置中添加base属性 constcreateRouter= () =>newRouter({ //mode:'history', //requireservice supportscrollBehavior: () => ({ y:0}), ...