0.60.0 - 0.60.3 - Error screen on fresh started app (RefreshReg) #25622

NicholasBertazzon · 2019-07-12T18:30:31Z

Hi,
I tried to start a fresh 0.60.3 react-native app and I got this error:
Can't find variable: $RefreshReg$
I'm developing under Windows 10, already tried to clean Android and reset cache.

Thanks.

React Native version: 0.60.3, but it also happens on 0.60.0, not tested on < 0.60

Steps To Reproduce

npx react-native init test
run it

Screenshots:

ecreeth · 2019-07-12T18:36:01Z

@NicholasBertazzon You can provide a little more information about the error, so that it can be easier to solve it. Maybe a screenshot or a repo

NicholasBertazzon · 2019-07-12T18:42:46Z

@NicholasBertazzon You can provide a little more information about the error, so that it can be easier to solve it. Maybe a screenshot or a repo

Of course, done.
I also tried to find "RefreshReg" in the whole node_modules but couldn't find a single line with it.
Managed to find it in the web:
https://github.com/facebook/react/blob/master/packages/react-refresh/src/__tests__/__snapshots__/ReactFreshBabelPlugin-test.js.snap

NicholasBertazzon · 2019-07-13T12:49:52Z

@ecreeth @kelset
I don't know guys, I'm done.
Since the problem appears to be in react-refresh, I tried to downgrade it. I tried with a bunch of versions but it wasn't working, so I switched to 0.0.2, reset the cache and what? It worked. Then I tried to go up, tried with 0.0.7, reset cache, 0.0.9, reset cache, 0.1.0, reset cache, 0.2.0, reset cache, and it's still working, even if 0.2.0 is the same as the one that is being installed at the beginning. What? Why?

kelset · 2019-07-13T15:33:08Z

Uhm that sounds super weird but at the same time, it seems to be suggesting that it's a problem related to caching :/

When there is Android involved sometimes I even try different simulators because there are some derived datas that are persisted and only way is to do a clean slate.

Also, when you start metro can you try to pass the flag --reset-cache?

NicholasBertazzon · 2019-07-13T16:02:10Z

Also, when you start metro can you try to pass the flag --reset-cache?

That's what I meant when I wrote "reset cache" :)
I did it a lot of times yesterday too, but it didn't work.

kelset · 2019-07-13T16:14:52Z

oh ok - then I'd suggest you clean all the caches 😂
I usually run all these commands (but not sure which ones work on Windows) + the Android gradle cleans (gradlew clean and gladlew cleanBuildCache).

rm -rf node_modules;
rm -rf $TMPDIR/react-native-packager-cache-*;
rm -rf $TMPDIR/metro-*;
rm -rf $TMPDIR/react-*;
rm -rf $TMPDIR/haste-*;
watchman watch-del-all;
yarn;
yarn start --reset-cache; (for starting the bundler)

vincentwuhrlin · 2019-07-13T23:17:06Z

Hello,

after a lot of hours and restart, and comparing with a new application started from scratch with same dependencies added in package.json which working, i think it is the file "package-lock.json".
I removed the "package-lock.json", and with new "node_modules" and cache deleted, it's working... 😃

Maybe this can help some people.

AndrewJack · 2019-07-17T11:30:15Z

I downgraded metro-react-native-babel-preset from 0.55.0 to 0.54.1 to fix this.

v0.55 includes react-refresh that @NicholasBertazzon mentioned

kelset · 2019-07-17T16:58:40Z

Nice catch @AndrewJack 👍
So I guess that it's currently happening for people forcefully upgrading their dep to go to 0.55?

Should we fix/lock dep in the dep to it?

react-native/template/package.json

Line 19 in 0190c9c

"metro-react-native-babel-preset": "^0.54.1",

🤔
I can't remember how ^ behaves with minor releases

AndrewJack · 2019-07-18T07:36:06Z

@kelset ^ will match the most recent minor version. It'll be safer to lock to "0.54.1" or use ~ to match the most recent patch version.

This may also happen to people installing fresh projects or projects without lock files.

Maybe a mention in the release notes too. Thanks for your help 👍

valery-lavrik · 2019-07-18T12:46:45Z

I have installed
"metro-reaction-native-babel-preset": "^ 0.54.1",
then executed:
rm -rf node_modules && npm install && cd android / && ./gradlew clean && cd .. && react-native run-android

As a result, anyway I got an error:
Property '$RefreshReg$' doesn't exist, js engine: hermes
Of course this is when enabled Hermes
enableHermes: true

I tried everything
but still getting an error

rm -rf node_modules
npm cache clean --force
npm cache verify
npm install
cd android/ && ./gradlew clean
deleted the application from the virtual device
react-native run-android

AndrewJack · 2019-07-18T13:02:52Z

@valery-lavrik remove the ^ from the metro-reaction-native-babel-preset dependency and rm -rf node_modules && npm install.

Then check your lock file to verify you are using v0.54.1 of metro-reaction-native-babel-preset

valery-lavrik · 2019-07-18T13:24:26Z

@valery-lavrik remove the ^ from the metro-reaction-native-babel-preset dependency and rm -rf node_modules && npm install.

Then check your lock file to verify you are using v0.54.1 of metro-reaction-native-babel-preset

did not help.
I have installed
"metro-react-native-babel-preset": "0.54.1",
deleted package-lock.json completely
then:

rm -rf node_modules
npm cache clean --force
npm cache verify
npm install
cd android/ && ./gradlew clean
deleted the application from the virtual device
react-native run-android

but the error still remained.
What did I forget?

AndrewJack · 2019-07-18T16:00:01Z

@kelset it looks like metro-source-map was updated to 0.55 with the hermes commit. It may be causing some issues if it doesn't match the other metro-* dependencies?

https://github.com/facebook/react-native/blame/eec4dc6b7287c5a3536ca18b553e3153a0aba103/package.json#L101

kelset · 2019-07-18T21:44:38Z

yeah I'll lock all the deps to 0.54.1 for the 0.60-branch. Thanks for helping out 👍

hamidjafari · 2019-07-20T12:09:53Z

upgrading to 0.60.4 by react-native upgrade solve the problem for me

nathanlemos · 2019-07-21T17:39:54Z

I'm also getting this issue at Ubuntu enviroment.

My project is currently using:

"react-native": "0.59.10",
"metro-react-native-babel-preset": "0.55.0",

When i try to upgrade react-native to >= 0.60.0 i get the same error message.

I've already tried to reset all caches, delete android and ios folder and re-create them with react-native upgrade --legacy true, downgrade metro-react-native-babel-preset and also tried to use npx, but with no success

AndrewJack · 2019-07-22T09:49:27Z

Found that [email protected] is needed for hermes to work. A mix of 0.54.1 for metro-react-native-babel-preset & 0.55 for metro-source-map should be ok.

cpojer · 2019-07-23T08:43:00Z

Yes, we can't lower the version of the metro-source-map package but mixing the newer version of that with other versions of Metro is fine.

mayursarode4 · 2019-07-24T10:13:44Z

react-native start
getting stuck/hangs system by consuming 100% memory at Loading dependency graph... since upgrade to 0.60.4 even fresh app
react-native init Demo
react-native run-android
Unable to solve this issue since last 2 days please help on it.
Tried above solutions but did not got succeed.

react-native-cli: 2.0.1
react-native: 0.60.4

AndrewJack · 2019-07-24T10:46:35Z

@mayursarode4 see #25650 (comment)

If you're on node v12.5 or later, downgrading to v12.4 will fix it.

mayursarode4 · 2019-07-24T13:00:02Z

@mayursarode4 see #25650 (comment)

If you're on node v12.5 or later, downgrading to v12.4 will fix it.

Done downgrading the node to v12.4.0, still same issue, still its getting stuck/hang.

jorgeibarra01 · 2019-07-30T15:06:16Z

I just finished upgrading these devDependencies and got the exact same error... Maybe this will help narrow it down?

"@babel/core": "^7.5.4",
"@babel/preset-env": "^7.0.0",
"@babel/runtime": "^7.5.4",
"@react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.8.0",
"metro-react-native-babel-preset": "^0.55.0",
"jest": "^24.8.0",
"react-test-renderer": "16.8.6",
"babel-preset-react-native": "5.0.2",

Maskedman99 · 2019-08-03T19:30:11Z

@kelset am facing this issue on Ubuntu, started 5 days ago after updating

"devDependencies": {
"@babel/core": "7.5.5",
"@babel/runtime": "7.5.5",
"@react-native-community/eslint-config": "0.0.3",
"@react-native-community/eslint-config": "0.0.5", <----------------
"babel-jest": "24.8.0",
"eslint": "6.1.0",
"jest": "24.8.0",
"metro-react-native-babel-preset": "0.54.1",
"metro-react-native-babel-preset": "0.55.0", <----------------
"react-test-renderer": "16.8.6"
},
"metro-react-native-babel-preset": "0.55.0",
"react-test-renderer": "16.8.6"

Resetting cache is not working, nor is downgrading metro-react-native-babel-preset to 0.54.1
Please provide a solution

valery-lavrik · 2019-08-04T12:31:48Z

everything works for me at the moment.
It is necessary to update packages to the latest versions (react-native and metro-react-native-babel-preset)

try to do everything in order:
rm -rf node_modules
npm cache clean --force
npm cache verify
npm install
cd android/ && ./gradlew clean
deleted the application from the virtual device
react-native run-android

Maskedman99 · 2019-08-05T03:12:43Z

I did what @valery-lavrik said and not working, I tried to create a new project and copy the code into the new one

react-native init test
cd test
react-native start
react-native run-android

still getting this error: Can't find variable $RefreshReg$,

package.json:
{
"name": "test",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"core-js": "^3.1.4",
"react": "16.8.6",
"react-native": "0.60.4"
},
"devDependencies": {
"@babel/core": "7.5.5",
"@babel/runtime": "7.5.5",
"@react-native-community/eslint-config": "0.0.3",
"babel-jest": "24.8.0",
"eslint": "6.1.0",
"jest": "24.8.0",
"metro-react-native-babel-preset": "0.54.1",
"react-test-renderer": "16.8.6"
},
"jest": {
"preset": "react-native"
}
}

Emulating on external device Samsung
Updated the packages

npm outdated
ncu -u
npm install

@react-native-community/eslint-config 0.0.3 → 0.0.5
metro-react-native-babel-preset 0.54.1 → 0.55.0

still getting the same error

garsharm · 2019-08-05T05:36:24Z

In My Case. I am using external android for development.
I tried building for prod and see if it works. It did.
Second, to make it work for dev build, I added
two lines to android/app/build.gradle
project.ext.react = [
+ bundleInDebug: false,
entryFile: "index.js",
+ enableHermes: true,
]
and its working now. no need to play with package file.
Its a issue with hermes and gradle.

Hope it will resolve your issue too.
Cheers!

mayursarode4 · 2019-08-05T06:00:22Z

#25650 (comment)

If you're on node v12.5 or later, downgrading to v12.4 will fix it.

@AndrewJack Thank you so much, it works for me.
As node version > v12.4 has memory issue which hangs the system even with 16GB RAM

Maskedman99 · 2019-08-05T18:25:12Z

Created another new project, and copied the codes and installed the packages to the new one, now it works, the default version of metro-react-native-babel-preset has been changed to 0.54.1,
Don't upgrade "metro-react-native-babel-preset" to 0.55.0
had to update "@react-native-community/eslint-config" to 0.0.5, to make eslint work on VScode.

imkrishh · 2019-08-12T17:06:42Z

I hope the issue might be with your package manager, please try updating npm package manager to the latest.
npm install -g npm@next

leosouza28 · 2019-08-23T03:26:28Z

In My Case. I am using external android for development.
I tried building for prod and see if it works. It did.
Second, to make it work for dev build, I added
two lines to android/app/build.gradle
project.ext.react = [
+ bundleInDebug: false,
entryFile: "index.js",
+ enableHermes: true,
]
and its working now. no need to play with package file.
Its a issue with hermes and gradle.

Hope it will resolve your issue too.
Cheers!

In my case, this worked too.
I removed my package-lock.json, node_modules, and changed values of enableHermes and bundleInDebug.
Finally, i installed node_modules and executed cd android && ./gradlew clean && cd .. && npm start --reset-cache && react-native run-android.
thanks @garsharm, and all the others.

xfyre · 2019-08-24T10:52:08Z

Only full cleanup (including package-lock.json) helps to solve this.

AZhilnikovv · 2019-08-28T13:17:26Z

If someone tried all suggestions with no result - the last thing is to recreate your project in another directory by cloning it from your repo. Only this helped me

kelset · 2019-09-04T10:59:53Z

It seems that you still need to pin your dependency to the version described above: #25622 (comment)

Because it seems that there is an issue with the react-native init command that ignores the version of metro-* specified in the template.

OriginLive · 2019-09-12T23:14:49Z

I'm getting these errors too and i've intalled navigation stack and drawer!

AZhilnikovv · 2019-09-13T07:56:29Z

I'm getting these errors too and i've intalled navigation stack and drawer!

I've encountered this error once more just after upgrading react-navigation from 3.x.x to 4.0.3. And installing react-navigation-drawer and stack didn't help me. I don't know, it seems like npm caches packeges in such a way that npm cache clean --force didn't help me as well. Also switching to yarn didn't help me. Only reinstalling project helped me.
By the way, I'm using win10.
I hope someone can give a solution without reinstalling project.

CrackyStudio · 2019-09-20T11:30:32Z

I had the same problem, and I solved it by removing my repo and cloning it again. Then npm install, and react-native run-android. I tried all other solutions and none worked for me.
PS: I use metro-react-native-babel-preset 0.56.0 and it works well. I don't know from where that problem come from.
Hope it helps.

stale · 2019-12-19T17:37:36Z

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

NicholasBertazzon added the Bug label Jul 12, 2019

kelset added the Platform: Windows Building on Windows. label Jul 12, 2019

NicholasBertazzon changed the title ~~0.60.3 - Error screen on fresh started app (RefreshReg)~~ 0.60.0 - 0.60.3 - Error screen on fresh started app (RefreshReg) Jul 13, 2019

This comment has been minimized.

Sign in to view

AndrewJack mentioned this issue Jul 18, 2019

ReactNativeJS ▶︎ Property '$RefreshReg$' doesn't exist #25684

Closed

kelset mentioned this issue Jul 18, 2019

0.60.6 Discussion react-native-community/releases#130

Closed

stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Dec 19, 2019

NicholasBertazzon closed this as completed Dec 24, 2019

facebook locked as resolved and limited conversation to collaborators Dec 24, 2019

0.60.0 - 0.60.3 - Error screen on fresh started app (RefreshReg) #25622

0.60.0 - 0.60.3 - Error screen on fresh started app (RefreshReg) #25622

Comments

NicholasBertazzon commented Jul 12, 2019 • edited Loading

Steps To Reproduce

ecreeth commented Jul 12, 2019

NicholasBertazzon commented Jul 12, 2019 • edited Loading

NicholasBertazzon commented Jul 13, 2019 • edited Loading

kelset commented Jul 13, 2019

NicholasBertazzon commented Jul 13, 2019 • edited Loading

kelset commented Jul 13, 2019

This comment has been minimized.

vincentwuhrlin commented Jul 13, 2019 • edited Loading

AndrewJack commented Jul 17, 2019

kelset commented Jul 17, 2019

AndrewJack commented Jul 18, 2019

valery-lavrik commented Jul 18, 2019 • edited Loading

AndrewJack commented Jul 18, 2019 • edited Loading

valery-lavrik commented Jul 18, 2019

AndrewJack commented Jul 18, 2019 • edited Loading

kelset commented Jul 18, 2019

hamidjafari commented Jul 20, 2019

nathanlemos commented Jul 21, 2019

AndrewJack commented Jul 22, 2019

cpojer commented Jul 23, 2019

mayursarode4 commented Jul 24, 2019

AndrewJack commented Jul 24, 2019

mayursarode4 commented Jul 24, 2019

jorgeibarra01 commented Jul 30, 2019 • edited Loading

Maskedman99 commented Aug 3, 2019 • edited Loading

valery-lavrik commented Aug 4, 2019

Maskedman99 commented Aug 5, 2019 • edited Loading

garsharm commented Aug 5, 2019

mayursarode4 commented Aug 5, 2019

Maskedman99 commented Aug 5, 2019 • edited Loading

imkrishh commented Aug 12, 2019

leosouza28 commented Aug 23, 2019

xfyre commented Aug 24, 2019

AZhilnikovv commented Aug 28, 2019

kelset commented Sep 4, 2019

OriginLive commented Sep 12, 2019

AZhilnikovv commented Sep 13, 2019 • edited Loading

CrackyStudio commented Sep 20, 2019

stale bot commented Dec 19, 2019

NicholasBertazzon commented Jul 12, 2019 •

edited

Loading

NicholasBertazzon commented Jul 12, 2019 •

edited

Loading

NicholasBertazzon commented Jul 13, 2019 •

edited

Loading

NicholasBertazzon commented Jul 13, 2019 •

edited

Loading

vincentwuhrlin commented Jul 13, 2019 •

edited

Loading

valery-lavrik commented Jul 18, 2019 •

edited

Loading

AndrewJack commented Jul 18, 2019 •

edited

Loading

AndrewJack commented Jul 18, 2019 •

edited

Loading

jorgeibarra01 commented Jul 30, 2019 •

edited

Loading

Maskedman99 commented Aug 3, 2019 •

edited

Loading

Maskedman99 commented Aug 5, 2019 •

edited

Loading

Maskedman99 commented Aug 5, 2019 •

edited

Loading

AZhilnikovv commented Sep 13, 2019 •

edited

Loading