1

I have a dir that has a lot of json files. Is there a way that I could load all of them in to ReactJS? Ideally, that would be a dict with filenames as keys and the json as values.

Example: if there are three json files (a.json, b.json, and c.json) under static/json/ directory, what I wanted to do is to have a dict that has the following structure: 

{
    'a':<parsed json from a.json>, 
    'b':<parsed json from b.json>, 
    'c':<parsed json from c.json>
}

That is essentially equivalent to do sth like import a from './static/json/a.json' 3 times and merge to a large json.

John M.
  • 825
  • 1
  • 10
  • 22
  • you can use webpack to bundle all file to a single js – Arash Aug 19 '18 at 03:37
  • in here I shared a webpack config file from one of my react based project. https://stackoverflow.com/a/51833162/4287032 – jsDevia Aug 19 '18 at 03:40
  • @Arash Sorry for this one I could not use webpack. – John M. Aug 19 '18 at 03:48
  • @jsDevia Due to some reasons I could not use webpack. Any other sols? – John M. Aug 19 '18 at 03:48
  • 1
    you could also use grunt or gulp. – jsDevia Aug 19 '18 at 03:49
  • @jsDevia Could you provide a minimum example here? I checked both and it seems they are both for large scale projects (but here I just want to load those files in - it is like a `os.listdir` and then read json iteratively. – John M. Aug 19 '18 at 04:08
  • Both grunt and gulp can be used for every project, small scale or large scale.I had used them in both kind of projects. – jsDevia Aug 19 '18 at 04:28
  • @jsDevia What I am targeting to is sort like solving the problem without introducing new packages. Do you know whether read jsons in a dir is doable in pure ReactJS/Javascript? Thanks! – John M. Aug 19 '18 at 04:34
  • Honestly I don's know exactly what it is you want, can u provide more detail about question. – jsDevia Aug 19 '18 at 04:40
  • @jsDevia Updated. Does it make more sense? – John M. Aug 19 '18 at 04:46
  • 1-these json files, are they in development stage or production ? 2-what is the content of these json files ? – jsDevia Aug 19 '18 at 04:52
  • @jsDevia 1. currently in dev but later need to be in prod. However, low performance is acceptable if needed to maintain the current structure (a dir has a few json files). 2. They are all formatted small json files, nothing special. – John M. Aug 19 '18 at 04:58
  • I wrote a solution for your problem, but my solution is in webpack environment, what is your environment now for bundling ? you must have to have one now. If u tell me i can convert my solution to yours. – jsDevia Aug 19 '18 at 05:18
  • @jsDevia Thanks! I was using [create-react-app](https://github.com/facebook/create-react-app) for my project. I ran it with `npm start`/`npm build`. – John M. Aug 19 '18 at 06:13

0 Answers0