Skip to content

Instantly share code, notes, and snippets.

Last active September 11, 2023 09:31
Star You must be signed in to star a gist
What would you like to do?
Clearing the Cache of your React Native Project
RN < 0.50 - watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache
RN >= 0.50 - watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* && rm -rf $TMPDIR/metro-bundler-cache-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache
RN >= 0.63 - watchman watch-del-all && rm -rf node_modules && npm install && rm -rf /tmp/metro-* && npm run start --reset-cache
npm >= 5 - watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache verify && npm install && npm start -- --reset-cache
Windows - del %appdata%\Temp\react-native-* & cd android & gradlew clean & cd .. & del node_modules/ & npm cache clean --force & npm install & npm start -- --reset-cache
Copy link

the-habu commented Mar 30, 2020

Even simpler solution:
npm uninstall -g react-native-cli
rm -rf ~/Projects/react-native-*
echo "" > /etc/hosts

Leave RN in the trash where it belongs. You'll thank me.

It's dangerous to go alone, take this: 🖕

Copy link

shardick commented Apr 11, 2020

Works on Windows 10 & react native >= 0.60

@echo off
echo Deleting metro cache
rd %localappdata%\Temp\metro-cache /s /q 
del %localappdata%\Temp\haste-map*
echo Cleaning build
cd android & gradlew clean & cd .. 
echo Deleting node_modules
rd node_modules /q /s 
echo Cleaning npm cache
npm cache clean --force 
echo Installing modules
npm install
echo Done

Copy link

vnshah commented Apr 19, 2020

Thank me later or not at all. Either way it's all good:
npm start -- --reset-cache

Worked like a charm! Thanks man.

Copy link

Hey guys hope you all are doing good.
I have a problem in react native app I want to add clear cache option in react native app for users to clear app cache when they want to clear basically my app is wallpapers app.
So kindly help me if it is possible.

Copy link

disrae commented May 19, 2020

Hmmm, not working for me, and I'm not using npm start, but I tried clearing the npm cache and running the watchmen command.

Copy link

Jp3rd commented May 28, 2020

I just ran into an issue that required figuring out how to purge everything related to a React Native build and I feel all the pain here. For sanity, I finally went and Dockerized the bundler and pointed the native app at the container just to make sure I wasn't crazy. That helped, since I could at least know that my application was working in theory.

It is very frustrating to have to go to 6 different places to get this reset.

For the command:

rm -rf $TMPDIR/metro-* && rm -rf $TMPDIR/haste-map-*
  • rm -rf means to recursively remove all files/folders at the following path
  • $TMPDIR is the environment variable for your systems temporary directory, it isn't the same on every platform
  • $TMPDIR/metro-* means every file/folder that matches with the * wildcard (so metro-foo as well as metro-bar)
  • The && means "run this command as well

So the whole command means to recursively purge any files that start with "metro-" or "haste-map-" from your system's temporary directory.

This worked for me, the metro cache file names have changed. I am using RN 0.59

Copy link

So I get:

React Native version mismatch.

JavaScript version: 0.62.2
Native version: 0.59.8

Make sure that you have rebuilt the native code. If the problem persists try clearing the Watchman and packager caches with watchman watch-del-all && react-native start --reset-cache.

[native code]:0



When I run:
MacBook-Pro$ watchman watch-del-all && rm yarn.lock && rm -rf node_modules && rm -rf $TMPDIR/metro-* && rm -rf $TMPDIR/haste-map-* && yarn

I get:
bash: watchman: command not found

Any ideas on how to fix this?

Copy link

close your terminal, delete your project node_modules then
npm i && npm start -- --reset-cache

Copy link

sebaxf commented Jun 9, 2020

Thank me later or not at all. Either way it's all good:
npm start -- --reset-cache


Copy link

Thank you! deleting node_modules & npm install & npm start -- --reset-cache works fine.


Copy link

I had so many issues on clearing the cache. Turns out that the metro bundler and haste map has changed their directory structure. 👎

This is the script I use to clean the cache:
watchman watch-del-all && rm package-lock.json && rm -rf node_modules && rm -rf $TMPDIR/metro-* && rm -rf $TMPDIR/haste-map-* && npm install

This has costed us DAYS, hope this helps someone :)

you save my day bro.. I tired every thing but nothing worked and finally your solution rocks

Copy link

Getting same error.
error: bundling failed: Error: Unable to resolve module @babel/runtime/helpers/interopRequireDefault from <root>/ Module @babel/runtime/helpers/interopRequireDefault does not exist in the Haste module map

Yarn add @babel/runtime not working.

react-native start --reset-cache not working.

Uninstalling watchman not working.

Below command is also not working for me.
watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* && rm -rf $TMPDIR/react-* && rm -rf $TMPDIR/metro-* && rm -rf node_modules/ && yarn cache clean --force && yarn install && react-native start --reset-cache

React Native Environment Info:
OS: macOS 10.14.6
CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
Memory: 82.13 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Node: 10.16.3 - /usr/local/bin/node
Yarn: 1.19.1 - /usr/local/bin/yarn
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Platforms: iOS 13.1, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
Android SDK:
API Levels: 28, 29
Build Tools: 28.0.3, 29.0.2
System Images: android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
Android Studio: 3.5 AI-191.8026.42.35.5900203
Xcode: 11.1/11A1027 - /usr/bin/xcodebuild
react: 16.8.6 => 16.8.6
react-native: 0.59.9 => 0.59.9
react-native-cli: 2.0.1

If there are some other solutions, please suggest. Totally stuck at this problem for 2 days.

Copy link

Wow this gist has really had traction. I apologize for not keeping this up to date. If anyone would like to provide me with the current standard for clearing your react native cache I can add it to the gist.

Copy link

Extremely helpful. Facebook needs to hire this guy ASAP.

Copy link


Copy link

@jarretmoses Is there a way to create a button to programmatically clear cache in release app... What do u think?

Copy link

mstrokin commented Dec 7, 2020

So I get:

bash: watchman: command not found

Any ideas on how to fix this?

@Carlos767 FYI
brew install watchman if you're using brew

Copy link

tgvishal commented Mar 15, 2021

Copy link

hzburki commented Aug 18, 2021

I get no matches found when trying to remove react-native-packager-cache* and metro-bundler-cache-*. I am using M1 mac.

Copy link

I get no matches found when trying to remove react-native-packager-cache* and metro-bundler-cache-*. I am using M1 mac.

Did you find anything? facing same issue...

Copy link

hzburki commented Nov 2, 2021

@MusabAkram No I didn't. This command still does not work for me, I usually start the packager separately by running npx react-native start -- --reset-cache and then start my app with npx react-native run-ios. I have not faced this issue ever since.

Copy link

@jarretmoses Would love an updated solution, nothing suggested is working for me

Copy link

@gaberogan sorry. This gist is fairly dated now I’ll look into updating it. According to the react native docs the recommended using

Copy link

netgfx commented Mar 2, 2022

I just use Flutter.... :D

Copy link

@netgfx great example on how to get blocked on Github.

Copy link

@jarretmoses hope someone gives @pmadruga some love for giving us something that really should be a part of the RN out-of-the-box tooling <3

Copy link

Hey guys i hop all are good ,

I want to clear a console.log clear using programmatically method so how i can do this?
Is there any one know how this happening or doing?

Please help me to solve this. Thank you.

Note : also i upload the pic, so it's clear that what log's i talk about it. 👍


Copy link



Copy link

evangrim commented Jan 30, 2023

My $TMPDIR ended in /, and current versions of NPM prevent npm cache clean with an error message, so I changed the TMPDIR strings and added --force to npm cache-clean, becoming:

watchman watch-del-all && rm -rf "${TMPDIR}react-native-packager-cache-*" && rm -rf "${TMPDIR}metro-bundler-cache-*" && rm -rf node_modules/ && npm cache clean --force && npm install && npm start -- --reset-cache --force

The error from NPM suggesting an alternative to npm cache clean --force:

npm ERR! As of npm@5, the npm cache self-heals from corruption issues
npm ERR!   by treating integrity mismatches as cache misses.  As a result,
npm ERR!   data extracted from the cache is guaranteed to be valid.  If you
npm ERR!   want to make sure everything is consistent, use `npm cache verify`
npm ERR!   instead.  Deleting the cache can only make npm go slower, and is
npm ERR!   not likely to correct any problems you may be encountering!
npm ERR! 
npm ERR!   On the other hand, if you're debugging an issue with the installer,
npm ERR!   or race conditions that depend on the timing of writing to an empty
npm ERR!   cache, you can use `npm install --cache /tmp/empty-cache` to use a
npm ERR!   temporary cache instead of nuking the actual one.
npm ERR! 
npm ERR!   If you're sure you want to delete the entire cache, rerun this command
npm ERR!   with --force.

npm ERR! A complete log of this run can be found in:

Copy link

Here is the response formatted in Markdown:

To clean the npm cache on your system, you should run the npm cache clean command. This will purge any cached packages and modules from the local npm cache folder.

Clearing out the cache can help resolve certain npm errors or inconsistencies, and also frees up disk space by removing redundant packages that have accumulated over time.

For a step-by-step guide on how to use the npm cache clean command, I recommend checking out this handy tutorial: npm clear cache.

It covers the full syntax and provides useful examples of cleaning the npm cache. The tutorial also explains some best practices around when you may want to clear the local cache.

Let me know if running npm cache clean helps resolve the issue you are running into. That TeachingBee article should give you a good overview of how to leverage the command.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment