javascript - 在 React 应用程序中检查 HTML 文件中的生产和暂存环境

Question

我正在尝试将第 3 方应用程序集成到我的 React 应用程序中。我必须使用不同的 keys 进行生产和登台，但我无法弄清楚如何在 React 和 Node 应用程序中实现这一点，我可以通过 process.env 做到这一点，但在 index.html 我无法弄清楚如何我能做到吗？

这是我的伪代码，我试图为我的 React 项目提取我的 index.html 文件

<script>
if(env === production){
  some_app.init('TOKEN_FOR_PRODUCTION');
}
else{
  some_app.init('TOKEN_FOR_STAGING_OR_DEV');
}
</script>

Answer 1

虽然我个人更喜欢 store 所有 API keys 在服务器本身上，但本指南表明还有其他方法可以做到这一点：

此外，要单独在前端定义 prod 和 staging 之间的差异，我建议使用 webpack 定义插件变量：

回答1