全局变量在 React Native 中不起作用 - Expo

Posted 2023-03-15

【中文标题】全局变量在 React Native 中不起作用 - Expo

【英文标题】：global variables not work in React Native - Expo

【发布时间】：2020-11-20 15:27:50

【问题描述】：

大家好，我尝试使用文件 .env 创建全局变量，但不起作用我使用 react native expo 我写了 process.env.API_URL 但没有找到这个变量。我要为工作做什么？

我绝望了

我读过https://www.npmjs.com/package/react-native-dotenv 和https://docs.expo.io/guides/environment-variables/，但对我不起作用。 我需要帮助！！！

【参考方案1】：

我在让环境变量工作时遇到了很多问题。奇怪的是，最强烈推荐的包是react-native-dotenv，而index.js 中的第一行代码是require('fs')，这是一个在React Native 中不可用的Node 模块。

无论如何，我最终创建了一个新的上下文来处理环境变量。我没有根据环境自动导入变量的逻辑，但这就像注释掉一行一样简单。

使用您的变量创建一个 JSON 文件，将其导入您的上下文中，并将其放在您的 app.js 返回顶部，从而允许您应用中的所有内容使用它。从那里，使用 useContext() 导入它，就像在任何其他上下文中一样，您可以访问所有变量。

编辑：在反复出现问题后，我决定只使用生产变量进行应用测试。这一点都不理想，但我敢肯定，很多人都处于与我相同的位置，变量中唯一真正的区别是 API 的路由名称（本地测试服务器与生产服务器）。不幸的是，ios 和 android 都不支持 http 请求，或带有自签名证书的 https 请求，无需编辑配置文件。如果您使用 Expo 托管流程，则这些配置文件不可用。因此，我唯一的选择是简单地对生产 API 进行测试。幸运的是，我有很好的日志可供参考，而且 API 本身相当成熟，并且已经通过 Web React 应用程序进行了大量测试。

如果有人有更好的解决方案，我很想听听。

【讨论】：

嗨！ react-native-dotenv 的维护者在这里。 require('fs') 之所以有效，是因为它不是 react-native-library；这是一个 babel 插件。让我知道它是否适合您。

【参考方案2】：

https://docs.expo.io/guides/environment-variables/#the-app-manifest-env

如果您已在托管中安装了 expo-constants 模块 工作流项目，您可以访问应用程序清单的属性。之一 这些属性是 .env 属性，该属性仅 运行 expo start 时可用。顾名思义，它包含 一些系统定义的环境变量。为了安全 原因，只有以REACT_NATIVE_ 或EXPO_ 开头的变量 可用。

如果您希望 API url 可用，则需要以 REACT_NATIVE_ 或 EXPO_ 为前缀

定义

REACT_NATIVE_API_URL=....

或

EXPO_API_URL=....

访问途径

process.env.REACT_NATIVE_API_URL

或

process.env.EXPO_API_URL

编辑

如果使用react-native-dotenv 模块

Usage

将您的 env 键值对添加到您的 .env 文件中

API_URL=....

现在将其导入您的 .js 文件中

import  API_URL  from 'react-native-dotenv';

【讨论】：

只有在我使用 expo-constant 时才有效。我不使用这个。