vite vue vue3 在nginx 根目录或非根目录中部署后刷新404或空白问题解决

本文主要是介绍vite vue vue3 在nginx 根目录或非根目录中部署后刷新404或空白问题解决，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

问题：

当在nginx中部署多个前端工程时，且用 history 模式时，不刷新则以，一刷新页面就是奥利给白！

故，经过再次研究（之前就弄过，现在忘了。。。。。），给有这种问题的朋友出教学稳住，哈哈。。。

准备：

nginx 目录

nginx

　　html

　　v3ts

　　sbin

　　conf

　　......

vue3 工程中设置

0、.env.v3production

1、router/index.ts

 history：设置成history模式，设置 base （即 createWebHistory 参数）：为设置为"你的文件夹名称"

或 根据环境 自己配置

2、

2.1、package.json

2.2、vite.config.ts

"base" ？"/你的文件夹名称/" : "/"

nginx中使用

3、nginx.conf

nginx.conf新增一个location /你的文件夹名称 ｛｝，注意非root需要改使用alias，最后要在里面新增一条try_files $uri $uri/ /你的文件夹名称/index. html;这个是解决刷新报404的问题。

参考

https://blog.csdn.net/weixin_42554373/article/details/116696898

这篇关于vite vue vue3 在nginx 根目录或非根目录中部署后刷新404或空白问题解决的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！