我可以使用 webpack 开发服务器的相对路径 - React js

Question

localhost:3000当我使用运行开发服务器时npm run start，服务器按预期工作。我正在使用react-scripts，我还没有弹出react应用程序。

我想做的是在反向代理后面设置开发服务器。因此localhost:5572/author/name/将指向运行在localhost:3000.

设置工作正常，index.html 已加载。但当开发服务器运行在 时"/"，页面会尝试将脚本加载为"<script src="/static/js/bundle.js"></script>". 因此，它期望 URL 为localhost:5572/static/js/bundle.js. 但反向代理正在提供相同的文件localhost:5572/author/name/static/js/bundle.js

在 package.json 中，我指定了

{
    ...
    "homepage": "./",
    ...
}

所以我的生产版本有相对路径，但开发版本没有。

有没有办法使用相对路径而不是绝对路径？或者我可以使用不同的解决方案。

谢谢。

Answer 1

.env.development在项目的根文件夹中创建名为的文件。将下一个字符串添加到文件中：

PUBLIC_URL=/author/name

此设置仅影响开发模式。有关如何定义环境变量的更多详细信息，您可以在此处找到。这里是一些有关使用公用文件夹的信息。