React Native：process.env只有NODE_ENV

Question

我在构建我的react-native应用程序时（在Windows上）设置环境变量：

filter

SET APP_ENV=dev & react-native run-android 返回＆＃39; dev＆＃39;

但是当我在我的JS文件中记录process.env对象时，我只得到：

echo %APP_ENV%

是否有不同的方法来访问通过命令提示符设置的环境变量？

Answer 1

重要的是要知道React-Native应用程序在环境中的设备（或模拟器）上运行，而不是像浏览器，而不是Node.js进程。

为了与依赖process.env.NODE_ENV执行优化的Node.js库交叉兼容，React-Native将process全局变量与env.NODE_ENV一起添加。

如果要将自定义常量传递给React-Native，可以使用：https://github.com/luggit/react-native-config

Answer 2

我发现解决此问题的最简单方法是使用 react-native-config 库，您可以查看 here。

1. 安装库：

$ yarn add react-native-config

2. 使用您的内容创建 .env 文件。例如：

GOOGLE_MAPS_API_KEY=abcdefgh

3. 从 Config 导入 react-native-config 并使用您的变量。

import Config from "react-native-config";
...
console.log('ENV:', Config.GOOGLE_MAPS_API_KEY); // ENV: abcdefgh

PS：安装软件包后，您需要运行 npx pod-install 以自动链接它，或者如果您的 React Native 版本早于 0.60，请按照 instructions on the library 手动链接它。

Answer 3

您应该安装此插件babel插件

npm install babel-plugin-transform-inline-environment-variables --save-dev

然后将其添加到插件部分中的babel配置（.babelrc，babel.config.js）中

{
  "plugins": [
    ["transform-inline-environment-variables", {
      "include": [
        "NODE_ENV"
      ]
    }]
  ]
}

然后，当您像

那样通过内联传递变量时，

APP_ENV=dev & react-native run-android

您应该通过

获得它

process.env.API_KEY

值将为dev

此功能在Mac终端上对我有用，希望它能回答您的问题

Answer 4

添加babel-plugin-transform-inline-environment-variables

npm install babel-plugin-transform-inline-environment-variables --save-dev

babel.config.js：

{
  "plugins": [
    ["transform-inline-environment-variables"],
  ]
}

请勿添加"include": ["NODE_ENV"]

然后运行API_KEY=testKey && react-native start 然后您可以通过API_KEY使用process.env.API_KEY，

但是console.log(process.env)仅显示{NODE_ENV: "development"}，但不包含API_KEY

很奇怪

Answer 5

这里的这些答案以及 React Native Expo Environment Variables 都没有解决，但我找到了 react-native-dotenv。

它成功了：

1. 终端：yarn add react-native-dotenv --dev
2. 在babel.config.js（或.babelrc）中：将"module:react-native-dotenv"添加到plugins
3. 在您的组件中，import { REST_API_KEY } from "@env"; 位于顶部
4. 在您的组件中，使用 as alert(REST_API_KEY);

当然，对于 alert，这是一个虚拟示例 :)

Answer 6

您可以安装react-native-dotenv。

并将这样的变量import { API_KEY, ANOTHER_CONFIG } from 'react-native-dotenv'导入到首选文件中。

添加

{
  "presets": ["module:metro-react-native-babel-preset", "module:react-native-dotenv"]
}

在 .babelrc 文件中。

然后，安装以下依赖项npm install metro-react-native-babel-preset --save-dev