如何正确使用环境变量？答案

【问题标题】：How can I use environment variables properly?如何正确使用环境变量？
【发布时间】：2019-12-16 11:45:33
【问题描述】：

我正在开发一个白标应用程序，我想知道如何使用环境变量为不同的环境/构建生成特定的颜色值和源图像。

我使用react-native-config 能够为我的代码特定构建操作/使用环境变量。

//.env.fistapp
APP_BUILD=Environment-firstapp

LOGIN_LOGO_IMAGE=./images/1Logo.png

LOGIN_SOME_BOOL=true

LOGIN_BACKGROUND_COLOR=#333
LOGIN_SIMPLE_TEXT_COLOR=#FFF
LOGIN_TEXTINPUT_BACKGROUD_COLOR=#FFF
LOGIN_LOGIN_BUTTON_COLOR=#009933

对于颜色值，它的工作正常如下：

<View styles={background: ${Config.LOGIN_BACKGROUND_COLOR}}/>

对于布尔值，我不知道正确的方法。环境变量总是string，所以我想解决方法是：

<Switch value={Config.LOGIN_SOME_BOOL === "true"}/>

但我对源图像有困难。我明白了：

Invalid call at line 18: require(_reactNativeConfig.default.LOGIN_LOGO_IMAGE) at C:\Users\myuser\Desktop\myproject\whitelabel\node_modules\metro\src\JSTransformer\worker.js:318:19

我已经尝试了所有这些方法：

import Logo from Config.LOGIN_LOGO_IMAGE

import Logo from `${Config.LOGIN_LOGO_IMAGE}`

const Logo = Config.LOGIN_LOGO_IMAGE

<Image source={require(Config.LOGIN_LOGO_IMAGE)}/>

<Image source={{uri: require(Config.LOGIN_LOGO_IMAGE)}}/>

【问题讨论】：

您好 LuizfBrisighello，您能否为我们提供一个您正在尝试完成的示例？或者一个 sn-p 代码，以便我们为您提供帮助。到目前为止，我们掌握的信息非常少。
@EduardVoiculescu 刚刚添加了更多信息。感谢您的提醒！

标签： javascript react-native environment-variables

【解决方案1】：

我认为您需要将此字符串放在引号中：LOGIN_LOGO_IMAGE="../../images/1Logo.png"。至于布尔值，打印出typeof(Config.LOGIN_SOME_BOOL)，如果它是布尔值，你需要做{Config.LOGIN_SOME_BOOL === true}（无引号）

【讨论】：

引用对我不起作用。 typeof(Config.LOGIN_SOME_BOOL) 返回 string.. 我猜 Config.LOGIN_SOME_BOOL === "true" 现在可以了..
是的，应该可以，你试过<Image source={{uri: require(Config.LOGIN_LOGO_IMAGE)}}/>吗？
<Image source={{uri: require(Config.LOGIN_LOGO_IMAGE)}}/> 也没有工作..我很困惑..
在顶部import Logo from Config.LOGIN_LOGO_IMAGE 然后<Image source={Logo}/> 怎么样？
也没有处理import Logo from Config.LOGIN_LOGO_IMAGE