Trying to load a large JSON file using import. This JSON file contains an object with keys that have numbers and hyphens. The issue arises when trying to access keys with hyphens or numbers as it returns undefined.
Using Rollup for building due to Svelte usage, had installed the json() plugin for importing, but seems to have trouble parsing object keys.
Noticed this while looping through the object - properties with hyphens return undefined while single-word ones work fine.
An example of an object that can be accessed without issues:
"accusoft": {
"changes": [
"5.0.0"
],
"ligatures": [],
"search": {
"terms": []
},
"styles": [
"brands"
],
// More data...
}
And here's an example object that results in undefined when accessed:
"accessible-icon": {
"changes": [
"5.0.0"
],
"ligatures": [],
"search": {
"terms": [
"accessibility",
"handicap",
"person",
"wheelchair",
"wheelchair-alt"
]
},
// More data...
}
Aware that hyphens are seen as operators, so utilizing square brackets for property access.
This is the TypeScript code being used:
import * as iconsList from '../../data/fontawesome-5/metadata/icons.json';
export interface IconEntryCollection {[key: string]: IconEntry; }
//Some code goes here
constructor(){
this.iconEntries = iconsList as IconEntryCollection;
this.icons = [];
}
//Some code goes here
console.log(this.iconEntries['accessible-icon']) // Returns undefined
Unsure if the issue lies in a mistake on my end or if Rollup isn't parsing the JSON accurately. Can provide additional code examples if needed.