react打包之后部署到tomcat非root目录

笔者最近做react项目,需求是部署到tomcat中,但是不能部署到tomcat得ROOT目录。

在网上搜到了很多类似于下面这种答案,以前的react版本用以下方法确实可以解决,但是,目前笔者使用得是17版本得react,找不到如下文件路径,故此专门写一篇自己解决办法。

路径:my-app\node_modules\react-scripts\config  改动path.js文件 ,大约在46行左右。

解决这个问题的思路大概分如下几步:

(1)路由地址,在你之前的地址前面加上你在tomcat配置的文件夹的名字,例如,你在react中使用的是 /home,你想在tomcat中把打包之后的项目放在  my 文件夹下面,那么,你应该修改你react路由地址为: /my/home

(2)webpack配置文件,如果你没有开启配置文件,请运行命令开启。修改 config 文件下面的 paths.js,将publicUrlOrPath修改为   ./,如下图所示,不要在路径前面加上路径解析。


(3)在react项目得public文件夹中,加入如下配置文件WEB-INF文件夹,如下图所示


WEB-INF

其中web.xml具体内容如下图所示,目的在于防止刷新页面出现404错误,代码较少,建议各位同学手写记忆一下,放图不放代码

web.xml

笔者是在老项目中嵌入react新项目,如果您刷新页面仍然404,尝试修改web.xml,将location内容替换为  /my/index.html

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容