Unable to print complete JSON using console.log

Question

I am trying to import JSON file into Sample variable but only first few characters are displayed from Sample variable.
The sample.json is 20,00,000 characters, When i print Sample variable on Console only first 3,756 characters are printed.Is there any limitations on the characters that can be printed through console.log?

Complete data persists in Sample variable, I verified it by searching for strings that occur at the end of sample.json file

var Sample = require('./sample.json');
export default class proj extends Component {
  constructor(props) {
    super(props);
    this.state = {
      locations: [],
    };
  }

  loadOnEvent() {   
      console.log(Sample);
     //this.state={ locations : Sample };
  }
}

Is there any other way to print data in Sample variable.

score 2 · Accepted Answer · answered Sep 17 '20 at 08:26

2

You have to convert json to string using JSON.stringify before logging.

/* ... */
  loadOnEvent() {   
      console.log(JSON.stringify(Sample));
     //this.state={ locations : Sample };
  }
/* ... */

answered Sep 17 '20 at 08:26

Minh Tú Hoàng

58
5

Is it possible to be doing with parsing to String – Akki Sep 17 '20 at 09:40

oklas · Answer 2 · 2017-02-11T12:59:22.170

0

Try to use another way to load. Use fetch if file is remote or use fs if file is local.

If it is memory problem supposed by @Shota consider to use server side processing requests to json file. It is good solution to setup microservice which load json file at startup and handle requests to data struct parsed from json file.

Answer for webpack use case:

Configure webpack to use file-loader or copy-webpack-plugin for specifically this file because it enough big. Consider to load it in parallel with webpack bundle. If your application have big parts which need not each case they must be moved to separated bundles.

edited Feb 11 '17 at 12:59

answered Feb 11 '17 at 10:06

oklas

7,935
2
26
42

Shall i install webpack from this URL:https://www.npmjs.com/package/react-native-webpack – Akki Feb 11 '17 at 10:33
I confuse tag, I just see for `webpack` tag and do not check that question have tag `react-native`. Seems you have another problem. I will remove answer. (try to use another way to load `fs` or `fetch`). If `fs` or `fetch` helpfull - please leave feedback. – oklas Feb 11 '17 at 10:51
Ok thanks, i tried fetch but not able to load local file using it – Akki Feb 11 '17 at 10:57
Please check updated question, the problem seems to be with console.log @oklas – Akki Feb 12 '17 at 15:43
May be console have some limitations or it is bug. Are you wabt to reveal it. Why you need to output full data? (try to output it partially) For example browser show partially data but its console is interactive and may be expanded. Pulling such big file for most cases is not good idea consider to create microservice. – oklas Feb 13 '17 at 15:53
I was just trying to verify whether the data was captured by printing it. However such logging statement would be commented during production release – Akki Feb 13 '17 at 16:36
Isn't there any other way to print data in react-native for debugging purpose? – Akki Feb 13 '17 at 17:07
I is another question http://stackoverflow.com/questions/30115372/how-to-do-logging-in-react-native – oklas Feb 14 '17 at 07:43

Unable to print complete JSON using console.log

2 Answers2