首先需要在服务器里下载nginx，
检查nginx是否安装，输入如下命令后若出现版本号则安装成功
然后启动nginx
如果有如下报错，则按照它的提示下载相关插件
我这里下载了2次不同的插件。直到运行server nginx restart指令成功
此时打开浏览器，输入你的服务器ip，就可以看到nginx启动成功
之后进行Vue项目打包：
在你一般输入运行npm run dev的地方输入npm run build就可以完成打包。
如果打包失败有提示build不存在之类的语句，如图：
那就试试npm run build:prod，完成打包！
之后会在项目根目录下自动生成一个默认dist文件夹
然后如果你是在本地打包的话，需要将此文件夹上传至你的服务器上。后边需要用到。
这里强烈建议将dist文件放在服务器里专门放项目的文件夹，后边设置路径的时候方便查找，比如我是放在了/home/ubuntu/myapp/ruoyi/ruoyi-ui的文件夹下
接下来配置 Nginx
一定要停止nginx的运行，否则配置可能不生效！(关于如何停止nginx，网上教程很多，就找到进程杀死进程就可以，或者用一句指令停止)
我们需要修改nginx.conf
找到有nginx.conf文件的目录，我们可以用sudo whereis nginx.conf找到该路径然后进入该目录
修改nginx.conf，输入如下命令：sudo vim nginx.conf,然后你如果是首次配置的话，可以直接复制我下边的代码，记得要修改root里dist的路径。
如果是之前配置过其它项目的话，只用把我http里边包含的 server 复制到你的文件对应位置就行！
然后保存并退出。
重启nginx
然后访问ip号就可以运行出页面了！！
大功告成！
总结
到此这篇关于nginx部署vue项目的文章就介绍到这了,更多相关nginx部署vue项目内容请搜索服务器之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持服务器之家！
原文链接：https://blog.csdn.net/changyana/article/details/123297702
声明： 猿站网有关资源均来自网络搜集与网友提供，任何涉及商业盈利目的的均不得使用，否则产生的一切后果将由您自己承担！ 本平台资源仅供个人学习交流、测试使用 所有内容请在下载后24小时内删除，制止非法恶意传播，不对任何下载或转载者造成的危害负任何法律责任！也请大家支持、购置正版！ 。本站一律禁止以任何方式发布或转载任何违法的相关信息访客发现请向站长举报，会员发帖仅代表会员个人观点，并不代表本站赞同其观点和对其真实性负责。本网站的资源部分来源于网络，如有侵权烦请发送邮件至：2697268773@qq.com进行处理。