The error occurs because the bundler cannot locate the default export from an empty string or missing module, typically due to a corrupted
node_modules cache or mismatched dependency versions in React Native and Expo projects. Clearing the Metro bundler cache, removing duplicate packages, and reinstalling dependencies usually resolves this issue by ensuring all internal modules are correctly linked.
Understanding the SyntheticPlatformEmitter Error
This specific error message is a hallmark of issues within the React Native ecosystem, particularly when using Expo. The
SyntheticPlatformEmitter is an internal module responsible for handling platform-specific events and utilities. When the bundler attempts to re-export this as a default but finds nothing in the target path (indicated by the empty quotes), it indicates a breakage in the module resolution chain. This often happens after updating packages, switching branches, or running into conflicts between different versions of React Native core libraries.
The root cause is rarely a syntax error in your code. Instead, it is almost always a structural problem with how the project's dependencies are stored on disk. The Metro bundler, which powers the JavaScript compilation in React Native, relies on a precise mapping of node modules. If this mapping becomes stale or if multiple conflicting versions of the same package exist, the resolver fails to find the expected exports.
Step-by-Step Resolution Guide
To fix this, you need to ensure that your environment is clean and consistent. Follow these steps in order, testing your app after each major change.
1. Clear the Metro Bundler Cache
The most common fix is clearing the development server cache. Metro caches compiled modules to speed up startup times, but this cache can become corrupted.
Run the following command in your terminal:
npx react-native start --reset-cache
If you are using Expo, use:
npx expo start -c
The
-c flag forces the cache to reset. If the error persists, proceed to the next step.
2. Delete node_modules and Package Lock Files
A stale installation of dependencies is a frequent culprit. You must completely remove the existing modules and lock files to force a fresh install.
Delete the following directories and files from your project root:
node_modules/yarn.lock (if using Yarn)package-lock.json (if using npm)pnpm-lock.yaml (if using pnpm)
After deletion, reinstall your dependencies using your preferred package manager:
npm install
Or for Yarn:
yarn install
For pnpm users, remember to run:
pnpm install
This ensures that the package manager rebuilds the dependency tree from scratch, resolving any version conflicts that may have caused the empty module path.
3. Check for Duplicate React Native Versions
Sometimes, a package will install its own copy of
react-native, leading to two different versions in the
node_modules folder. This causes the bundler to look for exports in the wrong place.
Check your
package.json and ensure you only have one version of
react-native listed in
dependencies. Then, verify the installed versions by running:
npm ls react-native
If you see multiple versions listed, you need to hoist them or remove the duplicate. In many cases, deleting
node_modules and reinstalling fixes this automatically, but if it persists, you may need to manually adjust your
overrides in
package.json to enforce a single version.
4. Verify Expo Configuration
If you are using Expo, ensure that your
app.json or
app.config.js is correctly configured. Sometimes, incorrect paths in the configuration can lead to module resolution failures.
Additionally, make sure your Expo SDK version matches the version of React Native it supports. For example, Expo SDK 49 requires React Native 0.72. Mismatches here can cause internal modules like
SyntheticPlatformEmitter to be missing or incompatible.
You can check your current Expo SDK version by looking at your
package.json under
expo or by running:
npx expo doctor
This command checks for compatibility issues and suggests fixes.
5. Update Dependencies
If none of the above steps work, consider updating your Expo SDK and related packages. Older versions may have bugs that were fixed in newer releases.
For Expo projects, run:
npx expo install --fix
This command updates all Expo-related packages to their compatible versions based on your current SDK. It helps resolve peer dependency conflicts that might be causing the module resolution error.
Preventing Future Issues
To avoid this error in the future, adopt a consistent dependency management strategy. Always use the same package manager (npm, yarn, or pnpm) throughout your project lifecycle. Avoid mixing package managers, as they handle hoisting and linking differently.
Regularly update your dependencies to stay on supported versions. Deprecated packages often stop receiving bug fixes, including those related to module resolution. Additionally, commit your lock files (
package-lock.json or
yarn.lock) to version control to ensure that every developer on your team installs the exact same dependency tree.
If you encounter similar issues with other modules, such as problems with importing SCSS variables, you might find our guide on
importing SCSS variables into another file helpful for understanding broader module resolution patterns in React Native.
Frequently Asked Questions
Why does the error show an empty string for the module path?
The empty string indicates that the bundler tried to resolve a relative import that resolved to nothing, often because the module was not found in the expected directory. This usually happens when a package is missing or incorrectly linked in
node_modules.
Can I fix this by restarting my computer?
Restarting your computer does not clear the Metro bundler cache or fix corrupted
node_modules. While it might refresh some system processes, it will not resolve the underlying dependency conflict causing this specific error.
Does this error affect production builds?
Yes, if the build process encounters the same module resolution failure, the production build will fail. However, sometimes the error only appears in development mode due to stricter caching or different bundler configurations. Always test production builds regularly to catch these issues early.
How do I know if I have duplicate React Native versions?
Run
npm ls react-native in your terminal. If the output shows more than one version number or lists
react-native as a dependency of another package, you likely have duplicates. Consolidating these into a single version is required for stable operation.
What should I do if npx expo install --fix doesn't work?
If automatic fixing fails, manually check your
package.json for outdated Expo packages. You can also try deleting the
android and
ios folders and rebuilding them using
npx expo prebuild to ensure native modules are correctly generated.