问获取响应根url路径

EN

我找到了解决方案: Webpack在env变量PUBLIC_URL中获得了react根URL

解决方案是更改映像src：

<img src=`${process.env.PUBLIC_URL}/images/example.png`

它在生产、发展和所有其他方面都起作用。谢谢你的帮助

这可以在homepage中设置package.json属性。

在构建项目时，您会看到一条解释该项目的消息：

该项目是在假定它托管在服务器根目录下构建的。若要重写此操作，请在package.json中指定主页。例如，将其添加到为GitHub页面构建它： "homepage": "http://myname.github.io/myapp"

请参阅文档：部署:构建相对路径

如果这样做，当它在本地dev环境上工作时，它也应该在生产上工作。

在您的例子中，设置"homepage": "https://example.com/interface/"使其在生产中工作。你不需要额外的代码。

请记住，您可能必须正确导入图像路径，以便由webpack处理该逻辑。您不应该在组件中有真正的web路径，只需从开发环境中的路径中导入一些东西，并进行神奇的工作。

import example from 'images/example.png';
[...]
<img src={example} />

见添加图像、字体和样式和使用公用文件夹:何时使用公用文件夹

如果我正确理解了您的问题，您希望能够根据您的开发环境和生产环境设置不同的根路径。

幸运的是，create允许您使用.env文件创建环境变量.

您将需要这些文件之一在您的本地和生产。请注意，您不能将这些文件添加到版本控制中，因为它们通常包含秘密密钥，即使它们没有，也是很好的做法。

一旦创建了.env文件，就需要在所有环境变量前加上REACT_APP<environment variable>，因此在本例中是REACT_APP_ROOT_PATH。然后，您需要按以下方式设置它；

用于本地环境的REACT_APP_ROOT_PATH=localhost/，以及

本地环境的REACT_APP_ROOT_PATH=example.com/interface/。

对于这个特性的更高级用法，下面是一些文档：https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#expanding-environment-variables-in-env

我希望这能帮到你。