如何为 CRA 包制作可配置的 json 文件答案

【问题标题】：How to make a configurable json file for CRA bundle如何为 CRA 包制作可配置的 json 文件
【发布时间】：2019-07-19 09:53:16
【问题描述】：

我使用 CRA 来捆绑我的 react 应用程序。

bundle 需要有一个静态可配置的 json，例如

//config.json
{
  "url": "url",
  "otherConfig": "otherConfig"
}

应用程序应该从这里读取 url 并使用它。如果需要更改它或任何其他配置，他们可以编辑该 json。这样就没有构建/部署步骤。

这有可能实现吗？或者有什么可能的问题？

你们中有人做过这样的事情吗？

【问题讨论】：

由于没有构建步骤，您不能“捆绑”它。当您的App 确实挂载时，您可以使用fetch 加载文件，并将值作为全局（为简单起见）或通过上下文（以避免冲突等）提供。您还需要更具体地了解“从此处读取网址并使用它”如何使用？
如果您将文件放在公用文件夹中并使用 fetch 获取 /config.json，它应该可以解决问题。但是如果你需要改变它，你需要 ssh/ftp 进入机器来更新它????也许使用 env 变量并重新启动服务器？
@ErichMenezes json的更新部分不在我的管辖范围内，我关心的是我的应用程序读取它。在公用文件夹中使用 fetch 似乎是个好主意。但是它不是异步的吗？我的应用代码是否有可能在该提取期间开始运行？
@YuryTarabanko fetch('从哪里来？')
@YuryTarabanko 读取 url 并将其用于 api 请求。

【解决方案1】：

使用 js 文件很容易。

制作一个config.js 文件

window.config = {
  "config": "xxx"
}

然后在index.js中导入

import './config.js'

打开public/index.html并添加以下脚本

<script src="%PUBLIC_URL%/config.js"></script>

构建后，将config.js 复制粘贴到build 文件夹中。

【讨论】：