笔者最近做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