Search code examples
reactjscreate-react-app

How to make a configurable json file for CRA bundle

I use CRA to bundle my react app.

There is a requirement for the bundle to have a static configurable json, for example

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

The app should read the url from here and use it. And in case there is a need to change it or any other config they can just edit that json. So that there is no build/deployment step.

Is this possible to achieve? Or what are the possible issues?

Did any of you get to do something like this?

Solution

  • It's quite easy with a js file.

    Make a config.js file

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

    Then import it in index.js

    import './config.js'

    open public/index.html and add the following script

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

    After building, copy-paste config.js into the build folder.