node.js - REACT_APP_* 与 NODE_PATH 环境变量

Question

常规 CRA 环境变量(必须以 REACT_APP_ 开头)和 NODE_PATH 变量(用于避免必须使用相对路径进行导入，../../../foo 等)之间有什么区别？ )

根据我的测试，除非以 REACT_APP 开头，否则不能使用任何变量，那么 NODE_PATH 变量如何不像其他不以 REACT_APP 开头的变量那样被忽略？

Answer 1

NODE_PATH 是可访问的，因为它被添加到 react-scripts 的 Webpack 配置中。

您可以在此处查看添加它的代码: https://github.com/facebook/create-react-app/blob/25184c4e91ebabd16fe1cde3d8630830e4a36a01/packages/react-scripts/config/env.js#L61

您会在该文件中看到您还可以设置 NODE_ENV 来设置您正在运行的环境(例如 development、staging等)以及 PUBLIC_URL

回答您关于差异的问题:

NODE_PATH 允许您使用绝对路径进行导入。例如，您可以将 NODE_PATH 设置为以下内容:NODE_PATH=src:src/components:src/containers 然后在您的 React 代码中您可以这样写: import Button from 'button' 而不是 import Button from '../../../button' 只要您在其中一个文件夹中有该模块 src、src/components 或 src/containers 因为 create-react 应用程序将在这些文件夹中查找 button 模块.实际上，您不会像使用 REACT_APP_* 变量那样在 React 代码中使用 NODE_PATH 变量。基本上，它会告诉您的应用到哪里寻找模块。

REACT_APP_* 变量在构建时使用我链接到的文件中的 Webpack 配置注入(inject)到您的应用程序中。

这:const GRAPHQL_URI = REACT_APP_GRAPHQL_URI

变成这样:const GRAPHQL_URI = https://example.com

如果您的 .env 文件中有这个:REACT_APP_GRAPHQL_URI = https://example.com