Closed halaei closed 2 years ago
Update: I found an easy reproduce. Make a js file that exports 1000 constants and import a few of the constants in App.js. The app will crash in iOS release but not in debug.
Hi @halaei ,
We are also facing the same issue for the past 3 weeks, Any solution on this issue.
Hello @ranjithOD We had a js files with almost 500 exports. We just split it into 2 separate js files and the issue was resolved. To me it seems to be an important bug in ReactNative core with probably some other implications than just not supporting too many exports. And to find out what was wrong was really hard. It took me days to figure it out.
We faced same issue after update to babel@7.16. Interesting enough
I'm working on a project made by React Native v0.63.4, and I have the same issue with the iOS release builds. Everything works on the debug and Android builds.
Hi @nekofar , did you solve the issue? I have the same problem which can not be debug anymore!
upgrade from 0.65.2 to 0.66.4 get the same error in debug modelοΌdisable herms works well
Hello @ranjithOD We had a js files with almost 500 exports. We just split it into 2 separate js files and the issue was resolved. To me it seems to be an important bug in ReactNative core with probably some other implications than just not supporting too many exports. And to find out what was wrong was really hard. It took me days to figure it out.
I can confirm, this is the solution π That's a weird problem in iOS
Hi π
How did you find these js files with almost 500 exports? What should we pay attention to?
@ranjithOD @mjm918
Hi π
How did you find these js files with almost 500 exports? What should we pay attention to?
@ranjithOD @mjm918
I had a file with constant variables. There were 1k+ variables. I guess you need to check your project files properly
Hi π
How did you find these js files with almost 500 exports? What should we pay attention to?
@ranjithOD @mjm918
This is really the best solution! @hakankarakaya , I had this problem too and it takes me over 2 weeks to find out the reason. I have 2 files with 1k+ variables exported in each file, just split it into smaller files and it works normally.
Hi π How did you find these js files with almost 500 exports? What should we pay attention to? @ranjithOD @mjm918
This is really the best solution! @hakankarakaya , I had this problem too and it takes me over 2 weeks to find out the reason. I have 2 files with 1k+ variables exported in each file, just split it into smaller files and it works normally.
Thanks π Do you think npm packages in node_modules are also included in this? Because when I search my project files there aren't that many.
We are having the same issue after upgrading from 0.63.4 to 0.64.3. Still an issue with 0.66.
Hello @ranjithOD We had a js files with almost 500 exports. We just split it into 2 separate js files and the issue was resolved. To me it seems to be an important bug in ReactNative core with probably some other implications than just not supporting too many exports. And to find out what was wrong was really hard. It took me days to figure it out.
Thank you @halaei this really works, it unblocked me for an urgent release.
We work around like this: bigFile.js (containing > 500 exports). So we split on 2 smaller files as needed, that allow us the less impact trough the usages, since we have trough our application:
import * as bigFile from './bigFile';
The new bigFile.js content will be:
const bigFilePart1 = require('./bigFilePart1');
const bigFilePart2 = require('./bigFilePart2');
module.exports = {
...bigFilePart1,
...bigFilePart2,
};
Hi π How did you find these js files with almost 500 exports? What should we pay attention to? @ranjithOD @mjm918
This is really the best solution! @hakankarakaya , I had this problem too and it takes me over 2 weeks to find out the reason. I have 2 files with 1k+ variables exported in each file, just split it into smaller files and it works normally.
Thanks π Do you think npm packages in node_modules are also included in this? Because when I search my project files there aren't that many.
@hakankarakaya Did you manage to solve it? π
You may use this command to find files in the current directory with too many exports. But it has false positive, because not all the reported files are going to be actually used in the bundle.
egrep -wcR 'export' . | awk -v FS=":" -v OFS="\t" '$2>500 { print $2, $1 }' | sort -hr
Example output with all files being actually OK:
1236 ./node_modules/@babel/types/lib/index-legacy.d.ts
899 ./node_modules/@babel/types/lib/index.js.flow
605 ./node_modules/typescript/lib/tsserverlibrary.d.ts
605 ./node_modules/csstype/index.d.ts
600 ./node_modules/csstype/index.js.flow
568 ./node_modules/typescript/lib/typescript.d.ts
567 ./node_modules/typescript/lib/typescriptServices.d.ts
515 ./node_modules/typescript/lib/tsserverlibrary.js
515 ./node_modules/typescript/lib/tsserver.js
514 ./node_modules/typescript/lib/typescriptServices.js
514 ./node_modules/typescript/lib/typescript.js
You may use this command to find files in the current directory with too many exports. But it has false positive, because not all the reported files are going to be actually used in the bundle.
egrep -wcR 'export' . | awk -v FS=":" -v OFS="\t" '$2>500 { print $2, $1 }' | sort -hr
Example output with all files being actually OK:
1236 ./node_modules/@babel/types/lib/index-legacy.d.ts 899 ./node_modules/@babel/types/lib/index.js.flow 605 ./node_modules/typescript/lib/tsserverlibrary.d.ts 605 ./node_modules/csstype/index.d.ts 600 ./node_modules/csstype/index.js.flow 568 ./node_modules/typescript/lib/typescript.d.ts 567 ./node_modules/typescript/lib/typescriptServices.d.ts 515 ./node_modules/typescript/lib/tsserverlibrary.js 515 ./node_modules/typescript/lib/tsserver.js 514 ./node_modules/typescript/lib/typescriptServices.js 514 ./node_modules/typescript/lib/typescript.js
Thanks mate, I tried it and got just some of the modules from your example, so your example saved me a lot of time investigating them! My crash eventually caused by a third party library - country-state-city - which apparently does not work well on an actual device.
Thanks a lot @halaei! π
I had the same problem. My redux action types file has over 1000 exports. Just splitting them into different files solved the problem. Weird but it worked.
Hi all,
I came across the same issue yesterday. Splitting the exports into separate files as suggested above works around the issue.
Recently, we upgraded Babel (@babel/core) from version 7.8.4 to 7.16.12. I found the following issue on Github https://github.com/babel/babel/issues/14273, in which a similar problem is occurring due to a bug.
The bug was fixed in the most recent version 7.17.7.
Upgrading Babel to this version resolved the issue without the need to split the exports.
Hope this helps!
Hi all,
I came across the same issue yesterday. Splitting the exports into separate files as suggested above works around the issue.
Recently, we upgraded Babel (@babel/core) from version 7.8.4 to 7.16.12. I found the following issue on Github babel/babel#14273, in which a similar problem is occurring due to a bug.
The bug was fixed in the most recent version 7.17.7.
Upgrading Babel to this version resolved the issue without the need to split the exports.
Hope this helps!
This fixed our issues too.
Thanks @danielp94 for the reference to the cause and fix. I assume the issue is fixed so I close it.
You may use this command to find files in the current directory with too many exports. But it has false positive, because not all the reported files are going to be actually used in the bundle.
egrep -wcR 'export' . | awk -v FS=":" -v OFS="\t" '$2>500 { print $2, $1 }' | sort -hr
Example output with all files being actually OK:
1236 ./node_modules/@babel/types/lib/index-legacy.d.ts 899 ./node_modules/@babel/types/lib/index.js.flow 605 ./node_modules/typescript/lib/tsserverlibrary.d.ts 605 ./node_modules/csstype/index.d.ts 600 ./node_modules/csstype/index.js.flow 568 ./node_modules/typescript/lib/typescript.d.ts 567 ./node_modules/typescript/lib/typescriptServices.d.ts 515 ./node_modules/typescript/lib/tsserverlibrary.js 515 ./node_modules/typescript/lib/tsserver.js 514 ./node_modules/typescript/lib/typescriptServices.js 514 ./node_modules/typescript/lib/typescript.js
Thanks mate, I tried it and got just some of the modules from your example, so your example saved me a lot of time investigating them! My crash eventually caused by a third party library - country-state-city - which apparently does not work well on an actual device.
Thanks a lot @halaei! π
@odedgolden so if we want to use features of "country-state-city" library, how can we attain that
Is everyone not getting this issue anymore after upgrading @babel/core to latest as mentioned above? We tried to pin our @babel/core version using yarn resolutions, but we are still getting the mentioned issue, and we are only able to fix it by separating large js files into smaller ones.
This is not ideal for us as the files are auto generated using graphql-codgen in our case, so I was wondering if I am the only one stuck with this issue.
Description
When we run our app in release mode for iOS, it crashes with the following stack. We used
bundle --minify false
to get a better stack trace. The trace containsloadModuleImplementation()
function which is defined in metro package. This crash doesn't happen in Android or debug mode.The issue started to happen about 2 weeks ago after updating dependencies, so we roll backed our yarn.lock and begin to interactively update depndencies in our project. So far, I find that the following change will break the app:
I can't find exactly which package caused the issue. Possible reasons:
Version
0.63.4
Output of
react-native info
System: OS: macOS 11.4 CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz Memory: 1.16 GB / 16.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 17.0.1 - /usr/local/bin/node Yarn: 3.1.0 - /usr/local/bin/yarn npm: 8.1.0 - /usr/local/bin/npm Watchman: 2021.10.18.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.2 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.0.1, iOS 15.0, macOS 12.0, tvOS 15.0, watchOS 8.0 Android SDK: Not Found IDEs: Android Studio: Not Found Xcode: 13.1/13A1030d - /usr/bin/xcodebuild Languages: Java: Not Found Python: 2.7.16 - /usr/bin/python npmPackages: @react-native-community/cli: Not Found react: 16.13.1 => 16.13.1 react-native: 0.63.4 => 0.63.4 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found
Steps to reproduce
We just build and run a release on iOS devices and get the crash. We haven't been able to find a minimal reproduce. Maybe someone can help here?
Snack, code example, screenshot, or link to a repository
No response