Question

在文档here (Building for Relative Paths)之后，所以在package.json中设置主页字段在构建期间不会设置PUBLIC_URL。

预期行为

%PUBLIC_URL%中的

build/index.html应替换为package.json主页字段中设置的网址。

的package.json：

"homepage": "https://example.com",

建立/ index.html中：

<script type="text/javascript" src="https://example.com/static/js/main.ec7f8973.js">

实际行为

<script type="text/javascript" src="/static/js/main.ec7f8973.js">

%PUBLIC_URL%将被替换为任何内容。

任何人都可以帮我解决这个问题。提前谢谢。

Answer 1

在package.json中设置主页字段后，生成生成内容时会显示以下消息：

The project was built assuming it is hosted at https://example.com.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.

这会导致您的实际行为。

我需要为元标记提供完整的URL，例如 og：image 和 twitter：image：src

如Timer said所示：“除非您明确使用PUBLIC_URL环境变量，否则只有URL的路径才会插入到％PUBLIC_URL％中。”

因此，我在应用程序的根目录中创建了一个 .env 文件，并在包的主页中添加了引用相同URL的变量：

REACT_APP_BASE_URL=https://example.com

在index.html中，我将％PUBLIC_URL％替换为env变量：

<meta property="og:image" content="%REACT_APP_BASE_URL%/img/facebook_1200x630.jpg" />

生成结果：

<meta property="og:image" content="https://example.com/img/facebook_1200x630.jpg" />

我相信您所需要的。

Answer 2

添加此

"homepage": "https://example.com/myapp",

而不是

"homepage": "https://example.com",

在package.json中设置主页不会在构建时设置PUBLIC_URL

2 个答案: