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

Question

当我 运行 localhost:3000 上的开发服务器使用 npm run start 时，服务器按预期工作。我正在使用反应脚本，我没有弹出反应应用程序。

我想做的是在反向代理后面设置开发服务器。因此 localhost:5572/author/name/ 将指向开发服务器 运行ning on 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. And here 是有关使用 public 文件夹的一些信息。