How to load json file? - json

Question

I am just trying to load JSON file into my react project. I did it like this:
fetch(dane).then(response => {
console.log(response);
return response.json();
}).then(dane => {
console.log(dane);
}).catch(err => {
console.log("Error Reading data " + err);
});
and I imported this file into project:
import data from "./data.json";
but I am getting error like this:Unexpected token < in JSON at position 0
How can I fix it?
If I am asking about something very stupid, just sorry.
The json file is in src folder.

Answer 1

You would only use fetch to get the data from an API and assign the response to a variable that you can call.
Since you are using a mock json response stored in a file, you can do the following.
Example:
A file called data.json containing the following.
{
"name": "John",
"age": "47",
"role": "admin"
}
Can be imported via:
import data from "./data.json"
Then used in your component however you wish.
<h1>Hello {data.name}.</h1>
<h2>Logged in as: {data.role}</h2>
Or if used outside of the render, like in a function:
console.log(data.role)
Also, Unexpected token < in JSON at position 0 seems like your JSON is improperly formatted.
The JSON file should only contain valid JSON data, as shown in my basic example above.