Metro bundler has encountered an internal error

[KnowMighT]

When I run yarn start in the terminal and use Expo App to open my RN Project in iPhone, an error appears as follows:

[rafeca]

Do you have any more information about the error? Any log shown on the terminal would help

[KnowMighT]

@rafeca There is only Failed building JavaScript bundle on the terminal. I can successfully run on Android but fail on iOS, neither iPhone or simulator.

I'm not sure that this problem is caused by metro. I created a new project and encountered the same problem, so maybe not code itself.

[qsmrf56]

Ok so I was having the same issue but I just restarted my IDE, command line and ran the app again it worked fine.

[onpaws]

Decided to try Expo today for the first time since last summer. Was eager to see what's new.
Started with exp init, chose the 'blank' app, followed by exp start
Installed Expo on my physical iPhone and attempted to connect via QR code.
Unfortunately got the same error as OP on physical iPhone.
Couldn't get Simulator to connect to Expo either.
I didn't try Android.

[mkrn]

This appears to be something very new, I haven't seen a problem like that before. Started out of nowhere, no helpful logs..

[vincekruger]

I'm having a similar problem. :(
I also do not have any interesting logs. http://snack.expo.io works perfectly with the same project.

[onpaws]

@vincekruger Thanks for mentioning that about Snack working.
I was able to get things started that way at least. While a web IDE is far from ideal at least it's something.

[onpaws]

@rafeca The out of the box experience is broken for me and these other folks, and coming up on a week with no response. Would appreciate your opinion here :)

[rafeca]

Hey people! I'd need some more specific logs/repro steps in order to investigate this.

I've tried to reproduce it in React Native v0.52 with my test app (https://github.com/rafeca/rn-test-app) and I cannot see such error, so this may be an issue with the expo CLI integration.

[onpaws]

Thanks for checking @rafeca!
Seeing as it's apparently specific to Expo, I'll be happy to pass the issue over there.

The problem is the Expo folks have disabled their issue tracker on GH.
If anyone here happens to know their preferred channel to file bugs, or their Slack, etc I'll be happy to pass this along.

[brentvatne]

I suspect there is some bug with npm 5 causing problems for people here, but nobody here actually provides steps to reproduce the problem so it's hard to say (as it works as expected for me and many thousands of other people). Please use npm 4 npm i -g npm@4 or yarn (https://yarnpkg.com/en/docs/install).

[onpaws]

Over on the Expo thread I opened, Brent helpfully recommended using yarn because npm5 apparently still has bugs.

In my case, even though I don't recall using npm to install exp, I nevertheless did a
npm uninstall -g exp followed by
yarn global add exp

and I'm back in business.
If you get a chance to try this, please post back if it worked for you.

Hope it helps!

[martonczirjak]

I had the same issue, npm start -- -- reset-cache solved it, if it says cant run on port **** kill thoose process and reset again

[KnowMighT]

@marcinkosiba it doesn't work for me : (

[KnowMighT]

@onpaws Thanks for investigating this problem. I have tried to npm uninstall -g exp followed by
yarn global add exp, but it also doesn't work for me.
I think I'd go crazy！😭

[serdarde]

React Native doesn't work with NodeJS 9 and new version of NPM
You have to downgrade your NodeJS version or you can use NVM to set different node version for each terminal: https://github.com/creationix/nvm

Downgrade your node version to: 8.9
and your NPM version to: 4.6.1

after that remove your node_modules directory and run npm install again

[joelachance]

It doesn't appear to work with ANY version of node & npm.

[nukes88]

Yeah same issue with me, i’ve tried using npm3.10.10 still the same, create new project, run on device (genymotion or even on iOS), get the metro bundler internal error

[GentryRiggen]

Fam,
I fixed my issue and like most of them, it's completely my fault. I was refactoring and deleted some files without cleaning up some imports of the deleted files. The only way I found this was to add a console.log in metro (node_modules/metro/src/lib/formatBundlingError.js).

function formatBundlingError(error) { console.log(error); }

[onpaws]

I just made a curious discovery.
I had a plus character + in the absolute path to my project folder, e.g.
/Users/pat/projects/+ReactNative/MyExpoProject

I moved my project to a new path:
/Users/pat/projects/MyExpoProject
restarted everything,
and we're off to the races.

[onpaws]

Anyone else have non-alphanumeric character(s) in the project absolute path?
Curious to hear if this works for others too.

[qgadrian]

@onpaws I don't have any non-alphanumeric in my project path, and I got this error suddenly, without any specific change..

I removed the node_modules folder and run yarn and everything looks fine now.

I'm using the snackbar dialog library and I have to run yarn build inside the dependency since they have a bug in the code. Just a disclaimer, maybe it's related, maybe it's not.

[KnowMighT]

@onpaws I tried to create a new project in the path which doesn't has non-alphanumeric character, it finally worked! lol

In my old project, there is non-alphanumeric characters in its absolute path. I ran yarn start in the terminal just now and found error as follows. it's caused by React%20Native (React Native) ！

[onpaws]

@KnowMighT Glad it worked for you!

[xtebs]

On my side this error was caused by incompatible Expo <--> React-native versions (After upgrading expo) and it is solved now.
Here are the compatibilities: https://docs.expo.io/versions/latest/sdk/index.html
-I replaced (e.g) the version of sdkVersion": "24.0.0" on app.json and expo "24.0.0" and react-native 0.51.0 (exact version)on package.json.

• Delete all node_modules and reinstall everything (npm install).
  Let me know if this solves your problems.

[rodiwa]

I suddenly started getting this error (Module bundler has encountered...) ever since I started using react-navigation-addons package. I updated my Expo versions on both ios simulator as well as XDE (latest @49.2.2), but that didn't solve the problem. I used yarn to add latest exp globally. Removing this react-navigation-addons package does not give me the error anymore.

As per some of the comments above, I'll try playing around with different versions of react-native (currently @0.52.0) to see if that helps.

[dennisja]

I got the same error and when I checked my error log this is the error:

error: bundling failed: Error: While trying to resolve module `react-native-vector-icons` from file `/Users/dj/Desktop/learn/react-native/crm/src/components/PersonItem.js`, the package `/Users/dj/Desktop/learn/react-native/crm/node_modules/react-native/local-cli/core/__fixtures__/files/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/dj/Desktop/learn/react-native/crm/node_modules/react-native/local-cli/core/__fixtures__/files/index.js`. Indeed, none of these files exist:

  * `/Users/dj/Desktop/learn/react-native/crm/node_modules/react-native/local-cli/core/__fixtures__/files/index.js(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`
  * `/Users/dj/Desktop/learn/react-native/crm/node_modules/react-native/local-cli/core/__fixtures__/files/index.js/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`
    at ResolutionRequest.resolveDependency (/Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:108:15)
    at DependencyGraph.resolveDependency (/Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/node-haste/DependencyGraph.js:269:4352)
    at /Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/DeltaBundler/traverseDependencies.js:201:36
    at Generator.next (<anonymous>)
    at step (/Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/DeltaBundler/traverseDependencies.js:256:306)
    at /Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/DeltaBundler/traverseDependencies.js:256:536
    at new Promise (<anonymous>)
    at /Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/DeltaBundler/traverseDependencies.js:256:217
    at addDependency (/Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/DeltaBundler/traverseDependencies.js:256:92)
    at /Users/dj/Desktop/learn/react-native/crm/node_modules/metro/src/DeltaBundler/traverseDependencies.js:237:9

Its like its due to react-native-vector-icons package in my case.
when I stop using the package, the error goes away. The error might be attached to some packages
I'm not using expo

[brentvatne]

I found that this can be due to assets in some cases, in particular when attempting to do a minified dev=false build. I had to clear the cache for it to go away (using exp, exp start -c)

[ghost]

easiest fix for me is
killall node -9

[mrcflorian]

Luckily, I fixed this by mistake. Posting here in case it'll help with the fix. Changing

"import NavigationBar from "./../../../components/common/";"
to
"import NavigationBar from "./../../..//components/common/";"

works.

(so adding an extra / before "components")

The first path is absolutely correct.

[har2008preet]

in my case, i didn't had sdk location in local.properties

[austinyearlykim]

npm installing modules without restarting expo XDE was the culprit for me, hope this helps

also, if you're reading this; you are loved and don't let anybody tell you otherwise <3

[rafeca]

Hey people, I'm going to close this issue, since it seems mostly related to expo (so the discussion is more relevant in expo/expo#1260)

[gersonmontenegro]

reinstall exp works for me

[dakt]

I had huge refactoring today and got stuck for hours with dangling imports all over the place, but thanks to @GentryRiggen I managed to fix them all.

[myarete]

Just in case anyone else finds themselves here, my solution (after several hours) to this exact error prompt was from VSCode sneakily importing:
import { Platform } from '../../node_modules/@types/react-native';
at the top of one file amongst other imports. When it should obviously be:
import { Platform } from 'react-native';

[kolithawarnakulasooriya]

Remove Node module.
rm -rf node_modules/

install again
npm install

then try with
expo start

then you will see the comming screen with

INFO : 12:37
Starting Metro Bundle on port 19001.

INFO : 12:37
Metro Bundler ready.

INFO : 12:37
Tunnel ready.

then run with your device.

[geocfu]

I had the same issue.
I am using react native ver. 0.57.
In my case, i dont use expo.
How i resolved it:

rm -rf node_modules/

npm install

react-native link

react-native run-android

for ios replace

run-android

with

run-ios

[pinsoneatra]

you may need to run
npm install
than
react-native run-android
that should be work.
reason because that project maybe download from internet or init from different version.
example: you init project at windows and run it not mac.

[insideMan15]

I had the same issue, npm start -- -- reset-cache solved it, if it says cant run on port **** kill thoose process and reset again

Thank you for the answer! It works for me.

[musicmeetscode]

I have the same issue, been about two weeks now. And ive noticed it appeared when i updated my expo

[mr-niri]

I have same problme with RN version "0.58.2" on ubuntu 18.04 LTS
I can fixed the problme just by openning the terminal and cd to project folder and run sudo npm start .

[konyan]

I have same problem with RN 0.59 on Mac
This error occurs , u are upgrading gradle 3.3.1 to 4.0.0 or something

RN default support 3 version

classpath 'com.android.tools.build:gradle:3.3.1'

while u open project in Android Studio , its show dialog of Auto Update gradle, u need to skip this dialog.

[PradeepLinkites]

npm start -- -- reset-cache

Thanks a lot...it works

[subhashchandrujobop]

Make sure
you have properly imported all the component because in my case that was the fault

[RONAKDHOLARIYA]

remove all files from C:\Users<your pc name>\AppData\Local\Temp

[ccksfh]

remove all files from C:\Users\AppData\Local\Temp

this works for me！！thanks！save my day

[joaoruirego]

That error appeared to me because when importing I wrote on terminal "nom start react-native-animatable --save", just by removing the "save" part, I was able to get it all working nicely

[johnphealipto]

I had the same issue, npm start -- -- reset-cache solved it, if it says cant run on port **** kill thoose process and reset again.

Thank you for this, it really fixed the issue. But in my own case I had to use the command below:
npx expo start -- --reset-cache