java 如何在 Tomcat 服务器上部署 reactJS 应用程序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/47987315/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to deploy reactJS application on Tomcat Server
提问by Pravin Abhale
I am new in reactjs, I want to deploy my reactjs application on tomcat server instead of running on react server which is default port is 3000. I run the npm serve command for running the npm local server but need to access that application using tomcat server.
我是 reactjs 新手，我想在 tomcat 服务器上部署我的 reactjs 应用程序，而不是在默认端口为 3000 的 react 服务器上运行。我运行 npm serve 命令来运行 npm 本地服务器，但需要使用 tomcat 服务器访问该应用程序.
Any suggestions please.
请提出任何建议。
Thanks
谢谢
回答by Passcode
npm run buildcan trigger the build process but it generates code assuming the base url doesnt have any relative path , but what if i want to deploy to a relative path in my server ??. So what i mean by relative path is that, I have a simpleapp folder inside my tomcat webapps directory and i want to access my react app from that i.e http://localhost/simpleapp. It gets even more complex if you use react router .
npm run build可以触发构建过程，但它会生成代码，假设基本 url 没有任何相对路径，但是如果我想部署到服务器中的相对路径怎么办？？。所以我所说的相对路径的意思是，我的 tomcat webapps 目录中有一个 simpleapp 文件夹，我想从它访问我的反应应用程序，即http://localhost/simpleapp。如果您使用 react router ，它会变得更加复杂。
I was getting a blank page but later, I found Some changes done on react router and package.json that solved my issue .
我得到了一个空白页面，但后来，我发现在 react router 和 package.json 上做了一些更改，解决了我的问题。
So the solutions that i found are :-
所以我找到的解决方案是：-
Mention homepage property in package.json
"homepage": "https://localhost:8080/simpleapp",
For react router we must add basename property .
在 package.json 中提及主页属性
"主页": " https://localhost:8080/simpleapp",
对于反应路由器，我们必须添加 basename 属性。
In above case for app to be deployed on simpleapp relative path
在上述情况下，应用程序部署在 simpleapp 相对路径上
<Router basename={'/simpleapp'}>
<Route path='/' component={Home} />
{/* … */}
</Router>回答by raksheetbhat
Run this command in the root folder of your react code.
在 React 代码的根文件夹中运行此命令。
npm run build
npm 运行构建
This generates an optimized production build in a folder called 'build', which basically contains an index.html page, with static JS and CSS files. You can then copy + paste these files into your Tomcat WebContent folder.
这会在名为“build”的文件夹中生成一个优化的生产版本，该文件夹基本上包含一个 index.html 页面，带有静态 JS 和 CSS 文件。然后，您可以将这些文件复制并粘贴到 Tomcat WebContent 文件夹中。
Here's a linkthat might throw some light on this.
这是一个可能会对此有所了解的链接。
回答by Nikhil Koul
You need to first decide on how you are going to build your project using Grunt or webpack. You can also add scripts like npm run buildin your package json which can trigger the build process.
The built project can be used in any web server by just placing the built files and including the script in your index.html.
您需要首先决定如何使用 Grunt 或 webpack 构建您的项目。您还可以npm run build在包 json 中添加脚本，这些脚本可以触发构建过程。构建的项目可以在任何 Web 服务器中使用，只需放置构建的文件并将脚本包含在您的 index.html 中。
