vue项目本地运行和打包放到nginx中不一致

vue项目本地运行和打包放到nginx中不一致,第1张

解决方法如下:
1、本地项目利用WebStrom做开发,vue框架。
2,项目在开发模式下运行(npmrundev),各功能表现的按照预期,主流浏览器(chrome,firefox,QQ,360,搜狗)兼容性良好。
3、打包(npmrunbuild)在项目根目录下生成dist文件夹。
4、将dist文件夹放在本地的nginx下的html文件夹下,在nginx的配置文件中加入虚拟服务器节点信息,在本机上访问,各主流浏览器(chrome,firefox,QQ,360,搜狗)的访问效果和项目在开发模式下运行(npmrundev)是相同的。
5、将dist文件夹压缩(7-Zip打包成tar文件),通过rz-be上传到Linux服务器,放在nginx的html下,tar-xvf解压,Linux上服务器nginx配置信息和版本与本地nginx的信息都是一致的。

vue如果是在本地启动并且访问本地的后台方法,就需要本地代理,vue提供了vueconfugjs文件给我们配置,vue项目启动的时候都会去找到processenv(启动环境),然后再代理到后台地址。nginx上启动也是同样的原理,只是把vueconfigjs文件换成了nginx配置。本地如果不需要代理的话 就可以直接去除vueconfigjs,直接在根目录下设置
env
envdevelopment
envproduction

如何使用Nginx来部署我们打包好的前端Vue项目

因为这里做的演示是本地服务,就需要安装在自己的电脑上

1确认你的电脑是否安装homebrew,打开电脑终端输入:

2确认homebrew是否安装成功,输入

3安装nginx

4确认nginx是否安装成功

6进入bin目录

输入,启动

验证是否启动成功
>简述:Spring boot+Vue 前后端分离项目部署,主要采用docker容器部署方式。

Springboot项目部署:docker构建mysql环境+docker构建项目自身环境。

Vue项目:使用docker启动nginx服务器方式代理部署。

项目使用mysql80作为数据源,所以部署时需要使用docker构建mysql环境及项目自身环境。

连接出现1251错误时:

首先将项目进行打包:mumu-001-SNAPSHOTjar

到此,springboot项目采用docker方式运行部署结束。

使用docker容器方式运行nginx服务器。

对于nginx服务器,重要的两个 *** 作是:

所以我们在配置启动nginx容器的时候,需要将对应的目录及文件进行宿主机挂载,方便后续更新资源及 *** 作

启动命令:


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zz/13480956.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-08-15
下一篇 2023-08-15

发表评论

登录后才能评论

评论列表(0条)

保存