REACT_APP_ *与NODE_PATH环境变量

时间:2018-07-11 16:09:54

标签: node.js reactjs environment-variables create-react-app

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

根据我的测试,除非使用以REACT_APP开头的变量,否则无法使用任何变量,那么如何像其他不以REACT_APP开头的变量那样忽略NODE_PATH变量?

1 个答案:

答案 0 :(得分:2)

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

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

您将在该文件中看到还可以设置NODE_ENV来设置您在哪个环境(例如developmentstaging等)中运行以及{{ 1}}

要回答有关差异的问题:

PUBLIC_URL允许您使用绝对路径进行导入。例如,您可以将NODE_PATH设置为以下内容:NODE_PATH,然后在React代码中,您可以编写如下内容:NODE_PATH=src:src/components:src/containers而不是import Button from 'button'将该模块放在文件夹import Button from '../../../button'srcsrc/components中,因为创建反应应用会在这些文件夹中寻找src/containers模块。您实际上不会像使用button变量那样在React代码中使用NODE_PATH变量。基本上,它告诉您的应用程序在哪里寻找模块。

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

此:REACT_APP_*

成为此:const GRAPHQL_URI = REACT_APP_GRAPHQL_URI

如果您的const GRAPHQL_URI = https://example.com文件中有此文件:.env