React Native - 捆绑 iOS 应用程序时，Metro Bundler 配置文件中未定义 .ENV

Question

我有 NPM 脚本，可以使用模拟的后端数据（用于组件测试）构建和运行我们的应用程序。他们使用 cross-env npm 包将 ENV 设置为内联。

"android-mock": "cross-env MOCK_BACKEND=1 NODE_ENV=development node generate-config.js && react-native run-android -- --reset-cache", - 模拟器在 Windows 上运行

"ios-mock": "cross-env MOCK_BACKEND=1 NODE_ENV=development node generate-config.js && react-native run-ios -- --reset-cache", - 模拟器在 MacOS 上运行

---

Metro 捆绑器会查找 MOCK_BACKEND 环境并基于此解析路径，以便应用使用模拟数据而不是依赖后端来获取它。

问题：Metro 只能在捆绑 Android 应用时读取 process.env.MOCK_BACKEND 值，在 iOS 上，该值返回 undefined。

---

定义 ENV 以便 Metro 可以正确读取它们以用于 iOS 捆绑的正确方法是什么？

Answer 1

我不知道为什么，但似乎 Metro 在捆绑 iOS 应用程序时会覆盖设置的 ENV。 其他地方定义了 ENV。

如果有人遇到这个问题，我就是这样解决的。

解决方案

1。在上面 NPM 脚本中的 generate-config.js 脚本中，我添加了 NODE_ENV 检查。该脚本根据 NODE_ENV 在公用文件夹中生成config.js。

const fs = require("fs");
console.log( process.env.NODE_ENV);

if(process.env.NODE_ENV === 'production'){
  fs.copyFile("config.runtime.js","public/config.js",(err) => {if(!err){console.log(err)}});
} else if (process.env.NODE_ENV === 'mock'){
  fs.copyFile("config.mock.js","public/config.js",(err) => {if(!err){console.log(err)}});
} else {
  fs.copyFile("config.debug.js","public/config.js",(err) =>{if(!err){console.log(err)}});
}

2。我已将生成的config.js 导入 Metro.config 并根据需要使用它。

const config = require(path.resolve(__dirname, 'public/config.js'));

config.js 供参考：

module.exports = {
    isProduction : false,
    disableCache: true,
    API:"http://alanj.bs.local:15455/",
    /////////////////////////////////////
    // ENVs
    /////////////////////////////////////
    MOCKED_BACKEND: 1,
    /////////////////////////////////////
}