提问者:小点点

如何在本地开发的子文件夹上部署React应用程序?


我有两个react应用程序,我正试图在本地运行。

例如:

  1. 我有应用程序编号1,这是登录应用程序,运行在localhost:3000
  2. 我需要应用程序2在localhost:3001/portal上运行

我目前的解决办法是:

  • 在第一项申请中:
BROWSER=none
HOST=localhost
PORT=3000

没有主页属性在package.json文件中。

  • 在应用程序2中,我进入包。json文件并添加主页属性。我设置了我的。env文件格式:
BROWSER=none
HOST=localhost
PORT=3001

目前,应用程序在https://localhost:3001/portal。然而,当我导航到它时,我看到的只是一个空白页。我觉得我遗漏了一些东西,应用程序不知道从哪里提供文件。

要运行两个应用程序,并且其中一个应用程序位于子目录上,应该进行什么设置?


共1个答案

匿名用户

经过长时间的研究,我发现了一个线程,其中非常详细地解释了如何实现这一点。

我应该如何配置CreateReact应用程序以从子目录服务应用程序?

您应该在e中设置一个环境变量。env类似这样的文件:

HOST=localhost
PUBLIC_URL=/your-subfolder-name
PORT=3000 <== (this is optional, if you want your application to run on port. In my case I was running multiplle applications there for each application had different port).

在设置变量并使用任何类型的路由器之后,您将需要根据该相对路径计算路由。要获取默认路径,您可以这样做:

process.env.PUBLIC_URL; <== (This will return your variable value that you set up in .env file).

因为我使用的是rescriptspackage,所以我不得不更改react脚本package。版本我必须安装的最低版本,以便react从读取PUBLIC\u URL变量。envwas3.4。1。上面的原因解决方案对我不起作用,因为rescripts版本低于3.4。1

"react-scripts": "3.4.1",