I have a sample JSON
response from an API that is about 52,000 lines. I've saved it as TestJSONFile.json
in my NextJS
project.
This isn't permanent, but just a temporary measure so I can have access to a sample API response without needing to connect/implement the actual API calls at the moment.
The project is working fine and there are no crashes, but there is this warning message:
./src/components/CurrentComponent.js
Should not import the named export 'something' (imported as 'TestJSONFile') from default-exporting module (only default export is available soon)
printWarnings @ hot-dev-client.js?a8a2:88
What can I do to get rid of this warning, just to make sure there are no issues later? I'm not entirely familiar with React so I'm not sure what the best way to handle this would be.
I don't need to call JSON.parse()
, since once I manually added the sample response into my project (copy/paste the entire response), the data is already interpreted as a Javascript object
and not a JSON string. I tried changing the filename from .json
to .js
to see if I could work with it that way without the warning, but the file had errors once I changed the extension.
TestJSONFile.json
looks like:
{
"something": [
{
"prop1": "prop1value",
"prop2": "prop2value",
...
},
{
"prop1": "prop1value",
"prop2": "prop2value",
...
},
...
}
In CurrentComponent.js
, I'm importing the JSON
values:
import * as SampleResponse from '../tools/TestJSONFile'
And then accessing the data like this:
const data = SampleResponse.something // Already a JS object, no need to parse
And then can work with it like any other object:
for (let item of data) { const prop1 = item.prop1 }
CodePudding user response:
Currently you are importing the JSON file as below
import * as SampleResponse from '../tools/TestJSONFile'
Change it to
import SampleResponse from '../tools/TestJSONFile'