我可以在webpack开发服务器中使用相对路径-反应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

此设置将仅在开发模式下起作用。有关如何定义环境变量的更多详细信息，请参见here。 here是有关使用公用文件夹的一些信息。