高级配置

你可以通过在 shell 中设置环境变量或使用 .env 来调整各种开发和生产设置。

注意：你不需要在以下变量之前声明 REACT_APP_，就像使用自定义环境变量一样。

变量	开发	生产	用法
BROWSER	✅ 已使用	🚫 已忽略	默认情况下，Create React App 将打开默认系统浏览器，在 macOS 上优先使用 Chrome。指定一个浏览器来覆盖此行为，或将其设置为 `none` 以完全禁用它。如果你需要自定义浏览器启动方式，可以指定一个节点脚本。传递给 `npm start` 的任何参数也将传递给此脚本，并且你的应用所服务 URL 将是最后一个参数。你的脚本的文件名必须具有 `.js` 扩展名。
BROWSER_ARGS	✅ 已使用	🚫 已忽略	当 `BROWSER` 环境变量被指定时，你设置到此环境变量的任何参数都将传递给浏览器实例。多个参数作为空格分隔的列表支持。默认情况下，不会将任何参数传递给浏览器。
HOST	✅ 已使用	🚫 已忽略	默认情况下，开发 Web 服务器绑定到设备上的所有主机名（`localhost`、局域网网络地址等）。您可以使用此变量指定不同的主机。
端口	✅ 已使用	🚫 已忽略	默认情况下，开发 Web 服务器将尝试监听端口 3000 或提示您尝试下一个可用端口。您可以使用此变量指定不同的端口。
HTTPS	✅ 已使用	🚫 已忽略	设置为 `true` 时，Create React App 将在 `https` 模式下运行开发服务器。
WDS_SOCKET_HOST	✅ 已使用	🚫 已忽略	设置后，Create React App 将运行开发服务器，并使用自定义 WebSocket 主机名进行热模块重新加载。通常，`webpack-dev-server` 将 `window.location.hostname` 作为 SockJS 主机名的默认值。您可以使用此变量一次启动多个 Create React App 项目的本地开发。有关更多详细信息，请参阅 webpack-dev-server 文档。
WDS_SOCKET_PATH	✅ 已使用	🚫 已忽略	设置后，Create React App 将运行开发服务器，并使用自定义 WebSocket 路径进行热模块重新加载。通常，`webpack-dev-server` 将 `/ws` 作为 SockJS 路径名的默认值。您可以使用此变量一次启动多个 Create React App 项目的本地开发。有关更多详细信息，请参阅 webpack-dev-server 文档。
WDS_SOCKET_PORT	✅ 已使用	🚫 已忽略	设置后，Create React App 将运行开发服务器，并使用自定义 WebSocket 端口进行热模块重新加载。通常，`webpack-dev-server` 将 `window.location.port` 作为 SockJS 端口的默认值。您可以使用此变量一次启动多个 Create React App 项目的本地开发。有关更多详细信息，请参阅 webpack-dev-server 文档。
PUBLIC_URL	✅ 已使用	✅ 已使用	Create React App 假设您的应用程序托管在服务 Web 服务器的根目录或 `package.json` (`homepage`) 中指定的子路径中。通常，Create React App 会忽略主机名。您可以使用此变量强制将资产按字面意义引用到您提供的 URL（包括主机名）。当使用 CDN 托管您的应用程序时，这可能特别有用。
BUILD_PATH	🚫 已忽略	✅ 已使用	默认情况下，Create React App 会将编译后的资产输出到与您的 `/src` 相邻的 `/build` 目录中。您可以使用此变量指定 Create React App 输出资产的新路径。BUILD_PATH 应指定为相对于项目根目录的路径。
CI	✅ 已使用	✅ 已使用	当设置为`true`时，Create React App 会将警告视为构建中的错误。它还会使测试运行器不进行监视。大多数 CI 默认情况下都会设置此标志。
REACT_EDITOR	✅ 已使用	🚫 已忽略	当应用程序在开发中崩溃时，您将看到一个带有可点击堆栈跟踪的错误覆盖层。当您单击它时，Create React App 将尝试根据当前运行的进程确定您使用的编辑器，并打开相关源文件。您可以发送拉取请求以检测您选择的编辑器。设置此环境变量将覆盖自动检测。如果您这样做，请确保您的系统PATH环境变量指向您的编辑器的 bin 文件夹。您也可以将其设置为`none`以完全禁用它。
CHOKIDAR_USEPOLLING	✅ 已使用	🚫 已忽略	当设置为`true`时，监视器将在轮询模式下运行，这在 VM 内部是必要的。如果`npm start`没有检测到更改，请使用此选项。
GENERATE_SOURCEMAP	🚫 已忽略	✅ 已使用	当设置为`false`时，不会为生产构建生成源映射。这解决了某些小型机器上的内存不足 (OOM) 问题。
INLINE_RUNTIME_CHUNK	🚫 已忽略	✅ 已使用	默认情况下，Create React App 会在生产构建期间将运行时脚本嵌入到`index.html`中。当设置为`false`时，脚本不会嵌入，而是像往常一样导入。这通常在处理 CSP 时是必需的。
IMAGE_INLINE_SIZE_LIMIT	✅ 已使用	✅ 已使用	默认情况下，小于 10,000 字节的图像将以 base64 编码为数据 URI 并内联到 CSS 或 JS 构建工件中。将其设置为控制以字节为单位的大小限制。将其设置为`0`将禁用图像的内联。
FAST_REFRESH	✅ 已使用	🚫 已忽略	当设置为`false`时，将禁用对 Fast Refresh 的实验性支持，使您能够实时调整组件而无需重新加载页面。
TSC_COMPILE_ON_ERROR	✅ 已使用	✅ 已使用	当设置为`true`时，即使存在 TypeScript 类型检查错误，您也可以运行并正确构建 TypeScript 项目。这些错误将在终端和/或浏览器控制台中以警告形式打印。
ESLINT_NO_DEV_ERRORS	✅ 已使用	🚫 已忽略	当设置为`true`时，ESLint 错误在开发过程中将被转换为警告。因此，ESLint 输出将不再出现在错误覆盖层中。
DISABLE_ESLINT_PLUGIN	✅ 已使用	✅ 已使用	当设置为`true`时，eslint-webpack-plugin 将被完全禁用。
DISABLE_NEW_JSX_TRANSFORM	✅ 已使用	✅ 已使用	当设置为`true`时，将禁用 React 17 中引入并回溯到 React 16.14.0、15.7.0 和 0.14.10 的新的 JSX 转换。新项目默认将使用支持此转换的 React 版本，但如果无法升级 React，您可能需要在现有项目中禁用它。