Question

如何在create-react-app中设置PUBLIC_URL？

我使用cross-env，这样就可以像下面那样设置PUBLIC_URL。

"start": "cross-env NODE_ENV=dev PUBLIC_URL=http://localhost:8080 react-app-rewired start --scripts-version react-scripts-ts"

然后console.log（process.env）向我展示了有关NODE_ENV开发人员的正确结果。但是PUBLIC_URL只是默认值“”。

如何设置PUBLIC_URL？我需要两个PUBLIC_URL用于开发和生产环境。

Answer 1

这是我在此问题上的经验：

create-react-app或CRA系统设置

％PUBLIC_URL％

位于应用程序文件夹根目录中的 .env 文件中的

变量，位于文件package.json旁边。无需在开发配置中使用PUBLIC_URL，根据我的经验，该应用在开发设置中运行良好。正在运行

yarn build

在CRA初始化的React应用程序上，

将根据PUBLIC_URL文件的内容设置.env变量。 .env文件应该包含什么？

只需括号或花括号即可

.env文件内容：

PUBLIC_URL=https://yourdomain.whatever/subdirectory

例如，如果您的应用是从/public_html/subdirectory提供的。

此外，CRA在其homepage文件中不支持package.json关键字，因此可以将其删除并在根目录中使用.env文件。

Answer 2

您已设置好。您的值与默认值相同。以下说明。

create-react-app具有两个不同的PUBLIC_URL：

进程环境PUBLIC_URL覆盖任何package.json主页。它可以是带有方案，主机和路径的完整URL。主机将用于提供正确的部署说明。

process.env.PUBLIC_URL只是来自流程环境PUBLIC_URL或主页的路径。

因此，当您运行

PUBLIC_URL=http://localhost:8080 react-app-rewired ...

在React中，您将拥有

process.env.PUBLIC_URL === ''

如果有

PUBLIC_URL=http://localhost:8080/foo react-app-rewired ...

在React中，您将拥有

process.env.PUBLIC_URL === '/foo'