Require cycle: node_modules/core-js/internals/microtask.js warning
KrisLau opened this issue · comments
Description
Getting this error when I build my React Native app
ERROR RangeError: Maximum call stack size exceeded, js engine: hermes
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
WARN Require cycle: node_modules\core-js\internals\microtask.js -> node_modules\core-js\internals\microtask.js
Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
React Native version:
info Fetching system and libraries information...
System:
OS: Windows 10 10.0.19043
CPU: (4) x64 Intel(R) Core(TM) i5-6600 CPU @ 3.30GHz
Memory: 2.12 GB / 15.89 GB
Binaries:
Node: 14.16.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.10 - ~\AppData\Roaming\npm\yarn.CMD
npm: 7.18.1 - C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK: Not Found
IDEs:
Android Studio: Version 4.1.0.0 AI-201.8743.12.41.7199119
Visual Studio: Not Found
Languages:
Java: 11.0.10
npmPackages:
@react-native-community/cli: Not Found
react: ^17.0.2 => 17.0.2
react-native: ^0.64.2 => 0.64.2
react-native-windows: Not Found
npmGlobalPackages:
*react-native*: Not Found
Steps To Reproduce
I'm not sure what caused it but it is similar to this commenter and issue #31173. The solution provided in #31173 is to disable Hermes but I would like to leave Hermes enabled since it is supposed to provide performance improvements.
Expected Results
No error in Metro
Snack, code example, screenshot, or link to a repository:
Missing Reproducible Example | |
---|---|
ℹ️ | It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner. |
Thanks for the issue @KrisLau would need more information then just the error message. Could you provide a repo that demonstrates the error from a fresh template.
@safaiyeh Sorry it's taken me so long to get back to you! So I figured out the part that's causing the error but I'm unsure how to resolve it as it was working prior. It's being caused by the AppRegistry.registerComponent(appName, () => Root);
when I change the Root
to App
, it works fine but I would like to have the dev meu toggle visible still. Also, another weird thing to note is that my code as-is works well in iOS with only the require cycle error (as opposed to on android where i also get an Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)
error)
I had followed the instructions from this blog: https://spicyseashells.com/article/react-native-storybook to implement the dev menu toggle for storybook.
My code (excluding import statements for brevity):
**// index.js**
AppRegistry.registerComponent(appName, () => Root);
**// Root.tsx**
const Root = () => {
const [storybookActive, setStorybookActive] = useState(false);
const toggleStorybook = useCallback(
() => setStorybookActive(active => !active),
[],
);
useEffect(() => {
if (__DEV__) {
// eslint-disable-next-line @typescript-eslint/no-var-requires
const DevMenu = require('react-native-dev-menu');
DevMenu.addItem('Toggle Storybook', toggleStorybook);
}
}, [toggleStorybook]);
return storybookActive ? <Storybook /> : <App />;
};
**// storybook/index.js**
const StorybookUIRoot = getStorybookUI({
host: Platform.OS === 'android' ? '10.0.2.2' : '0.0.0.0',
asyncStorage: AsyncStorage,
});
AppRegistry.registerComponent(appName, () => StorybookUIRoot);
export default StorybookUIRoot;
Any updates on this? When I set inlineRequires = false
, the app builds successfully but I'd like to keep inline require enabled if possible
I'm getting the same issue as @KrisLau. And it's also relative to Storybook.
Even the simple boolean-based export type creates troubles (in my case, react-hook-form stops working)
// App.tsx
...
export default config.storybook.LOAD_STORYBOOK ? StorybookUI : App
The only warning I'm getting is about the Require cycle
The unique working solution is to set inlineRequires: false
in metro.config.js
.
Looks like this have not too much to do with RN itself and warning is properly thrown in that case.
This seems to be a problem with Storybook for ReactNative and it should be addressed with next version.
See more here: storybookjs/react-native#240
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
This issue was closed because it has been stalled for 7 days with no activity.