You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Firstly, thanks for spending the time to open this and read this. So!
I need to point out that i've just started react native 4 weeks ago from react web development.
Basically i'm making an app where i need to import a pretty big JSON file called 'cityData.json' with the size of around 23.8MB.
and one element of the JSON array looks like this...
and there are plenty of these elements.
And whenever i run the code using react-native run-android, i get a memory issue from the bundler.
Heres a screenshot of what it looks like...
I spent around 3 hours searching why this was happening, and alot of people suggested something about how something shouldn't be transpiled? Something about transforming? Sorry like i said i'm a newbie. They then recommended that i "ignore": the bundle from interacting with my JSON file using .babelrc or package.json? I'm not exactly sure about what they mean about that. I don't get the **/*.js syntax. But i do know for a fact, that whenever i pass in smaller JSON files, it loads perfectly. It's just this JSON file that's wayyy to big! That progress bar just won't move...
As you can see after reading that paragraph, i'm really bad with anything to do with babel and bundles. So hopefully, you guys (who are much more experienced than me) can help me with this!
Reproducible Demo
To reproduce this,
download a JSON file with the size of 23MB
create create-react-native-app
do npm run eject
make a folder named dataFolder
move JSON file called (cityData.json) into dataFolder
in App.js add the following code:
It looks like you are using an older version of React Native. Please update to the latest release, v0.56 and verify if the issue still exists.
The ":rewind:Old Version" label will be removed automatically once you edit your original post with the results of running react-native info on a project using the latest release.
IMHO, it's not efficient to store such a large data in JSON file, and include it in an app, because it'll consume a lot of RAM. I would recommend to store it on a server and access it via API, or use proper DB.
Environment
Environment:
OS: Windows 10
Node: 10.8.0
Yarn: 1.3.2
npm: 6.2.0
Watchman: Not Found
Xcode: N/A
Android Studio: Not Found
Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: ~0.55.2 => 0.55.4
Description
Hey everyone!
Firstly, thanks for spending the time to open this and read this. So!
I need to point out that i've just started react native 4 weeks ago from react web development.
Basically i'm making an app where i need to import a pretty big JSON file called 'cityData.json' with the size of around 23.8MB.
and one element of the JSON array looks like this...
{ "id": 707860, "name": "Hurzuf", "country": "UA", "coord": { "lon": 34.283333, "lat": 44.549999 } },
and there are plenty of these elements.
And whenever i run the code using react-native run-android, i get a memory issue from the bundler.
Heres a screenshot of what it looks like...
I spent around 3 hours searching why this was happening, and alot of people suggested something about how something shouldn't be transpiled? Something about transforming? Sorry like i said i'm a newbie. They then recommended that i "ignore": the bundle from interacting with my JSON file using .babelrc or package.json? I'm not exactly sure about what they mean about that. I don't get the **/*.js syntax. But i do know for a fact, that whenever i pass in smaller JSON files, it loads perfectly. It's just this JSON file that's wayyy to big! That progress bar just won't move...
As you can see after reading that paragraph, i'm really bad with anything to do with babel and bundles. So hopefully, you guys (who are much more experienced than me) can help me with this!
Reproducible Demo
To reproduce this,
download a JSON file with the size of 23MB
create create-react-native-app
do npm run eject
make a folder named dataFolder
move JSON file called (cityData.json) into dataFolder
in App.js add the following code:
const cityData = require('./dataFolder/cityData.json');
Then run the app with react-native run-android
Then the error will occur.
The text was updated successfully, but these errors were encountered: