How To Clean Gradle Cache In React Native

How to clear react-native cache?

In react-native development, there are multiple caches used when the app is built:

React-native packager cache
Emulator cache
Java side cache (.gradle) folder (only in android)
npm cache (if relevant?)

Am I missing something also? Because I'm trying to clear cache in react-native, to be able to repeat a bug that only occurs on first usage. But clearing those caches above did not help. This is on android. When the app is building, most of the rows DO NOT say UP-TO-DATE, as expected, because I cleared the cache.

But, there are still many rows where this text is printed. Like:

app:preBuild UP-TO-DATE

app:preDebugBuild UP-TO-DATE

:app:preReleaseBuild UP-TO-DATE

The question is, how can I clear the whole cache related to react-native development?

Answer #1:

For React Native Init approach (without expo) use:

            npm              start              -- --reset-cache

Answer #2:

Clearing the Cache of your React Native Project:

npm < 6.0 and RN < 0.50:

                          watchman watch-del-all && rm -rf $TMPDIR/react-* &&  rm -rf node_modules/ &&              npm              cache clean &&              npm              install &&              npm              start -- --reset-cache

npm >= 6.0 and 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 --force &&              npm              install &&              npm              start -- --reset-cache

Answer #3:

Simplest one(react native,npm and expo )

For React Native

            react-native              start              --reset-cache

for npm

            npm              start              -- --reset-cache

for Expo

            expo              start              -c

Answer #4:

try this

            react-native              start              --reset-cache

Answer #5:

For those who are using expo-cli

expo start -c

Answer #6:

This is what works for me:

            watchman watch-del-              all              &&              rm              -f yarn.lock              &&              rm              -rf node_modules              &&              yarn              &&              yarn              start              --reset-cache

Answer #7:

Here's a great discussion on GitHub which helped me a lot. Clearing the Cache of your React Native Project by Jarret Moses

There are solutions for 4 different instances.

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
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 eact-native-* & cd android & gradlew clean & cd .. & del node_modules/ & npm cache clean --force & npm install & npm start -- --reset-cache

The solution is similar to Vikram Biwal's Answer.

And there is a discussion below in the given link, so even if the above 4 cases don't work for you, you can scroll through and find a possible solution.

Answer #8:

If you are using WebStorm, press configuration selection drop down button left of the run button and select edit configurations:

edit configurations

Double click on Start React Native Bundler at bottom in Before launch section:

before launch

Enter --reset-cache to Arguments section:

arguments

Answer #9:

Clearing the Cache of your React Native Project: if you are sure the module exists, try this steps:

Clear watchman watches: npm watchman watch-del-all
Delete node_modules: rm -rf node_modules and run yarn install
Reset Metro's cache: yarn start --reset-cache
Remove the cache: rm -rf /tmp/metro-*

Answer #10:

You can clean cache in React Native >= 0.50 and npm > 5 :

            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

Apart from cleaning npm cache you might need to reset simulator or clean build etc.

Answer #11:

Below commands worked for me for Android and Yarn,

                          cd              android && ./gradlew cleanBuildCache &&              cd              .. && watchman watch-del-all && rm -rf node_modules/ && rm -rf              $TMPDIR/react-native-packager-cache-* && rm -rf              $TMPDIR/metro-bundler-cache-* &&   yarn cache clean && yarn install &&  yarn start --reset-cache

Answer #13:

I had a similar problem, I tried to clear all the caches possible (tried almost all the solutions above) and the only thing that worked for me was to kill the expo app and to restart it.

Answer #14:

I went into this issue today, too. The cause was kinda silly -- vscode auto imported something from express-validator and caused the bug.

Just mentioning this in case anyone has done all the steps to clear cache/ delete modules or what not.

Answer #15:

Currently, it is built using npx, so it needs to be updated.

Terminal : npx react-native start --reset-cache

IOS : Xcode -> Product -> Clean Build Folder

Android : Android Studio -> Build -> Clean Project