Failed to load configuration of my react native project

Question

./gradlew clean command in the android directory has issues too. I've tried downgrading the npm version but no help. Any ideas?
Below is the log I get when I run npx react-native run-android:

 error Failed to load configuration of your project.
    Error: Cannot find module '...\node_modules\json-parse-better-errors\index.js'. Please verify that the package.json has a valid "main" entry
        at tryPackage (internal/modules/cjs/loader.js:320:19)
        at Function.Module._findPath (internal/modules/cjs/loader.js:533:18)
        at Function.Module._resolveFilename (internal/modules/cjs/loader.js:875:27)
        at Function.Module._load (internal/modules/cjs/loader.js:745:27)
        at Module.require (internal/modules/cjs/loader.js:961:19)
        at require (internal/modules/cjs/helpers.js:92:18)
        at Object.<anonymous> (D:\projects\Beauty\node_modules\parse-json\index.js:3:18)
        at Module._compile (internal/modules/cjs/loader.js:1072:14)
        at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
        at Module.load (internal/modules/cjs/loader.js:937:32)

Environment:

OS: Windows 10
react native: 0.65.1
Node: 14.17.4
npm: 7.23.0

Okay apparently there were some version conflicts. Working fine now. [Closed] — Kiana Kazeminejad, Oct 16 '21 at 15:36

score 27 · Answer 1 · edited Sep 07 '22 at 17:11

27

use this command for installing the node module first

npm install --force

after that use

npx react-native run-android

for running the project

edited Sep 07 '22 at 17:11

Iva

2,447
1
18
28

answered Sep 01 '22 at 16:17

Nikhil Dangi

289
3
4

score 15 · Answer 2 · edited Oct 26 '22 at 09:46

15

Happened to me earlier today because of mixing between npm and yarn package managers, a simple npm install solved this. No need to include --force flag.

edited Oct 26 '22 at 09:46

Mike Szyndel

10,461
10
47
63

answered Sep 03 '22 at 19:45

Anass

301
1
3
13

3

That’s why it’s a bad practice to mix yarn and npm – DᴀʀᴛʜVᴀᴅᴇʀ Sep 03 '22 at 19:52
Agreed. Yarn is fast, but I am working on a reactjs project and realized it is a bad practice and learned from my mistake :) – Anass Sep 03 '22 at 20:04
My Issue was, I completely forgot to npm install, and run run-ios directly. – Jovylle Sep 15 '22 at 07:18
Guys I am using yarn and facing the same issue while creating a new project. Any idea how to resolve this with yarn? – Archana Sharma Dec 30 '22 at 05:33

paneer_tikka · Answer 3 · 2022-12-04T03:09:07.713

I got this in an nx monorepo only for a specific app (but not others). None of the above methods worked for me. Finally figured this -

TLDR;

This is not the actual error (you probably guessed this). This error message comes from node_modules/@react-native-community/cli/build/index.js OR node_modules/react-native/node_modules/@react-native-community/cli/build/index.js.

To be sure, you can run this in node_modules directory: find . -name '*.js' -print0 | xargs -0 grep "Failed to load configuration of your project" 2. Edit these files to print the underlying error.

  } catch (error) {
    /**
     * When there is no `package.json` found, the CLI will enter `detached` mode and a subset
     * of commands will be available. That's why we don't throw on such kind of error.
     */
    if (error.message.includes("We couldn't find a package.json")) {
      _cliTools().logger.debug(error.message);

      _cliTools().logger.debug('Failed to load configuration of your project. Only a subset of commands will be available.');
    } else {
      //---> ***** Print the underlying error!
      console.log('=============>', error);
      throw new (_cliTools().CLIError)('Failed to load configuration of your project.', error);
    }
  }

For me, this printed: =============> [CLIError: Node module directory for package react-native-animated-pagination-dots was not found]
All I had to do fix it was yarn add react-native-animated-pagination-dots. If only CLI had printed this underlying error, it would have saved me several hours! :-/

Longer explanation When upgrading my monorepo, I somehow landed in a situation where one of the packages got removed from my packages.json, presumably because yarn couldn't resolve it (in my case this package was react-native-animated-pagination-dots). Then the app which had this dependency started getting this error, the other app didn't.

Thanks a lot panner_tikka! This saved me a lot of hours too. I'm really curious, how did you come across this command, could you explain more on this? find . -name '*.js' -print0 | xargs -0 grep "Failed to load configuration of your project" — A . L. I, Feb 10 '23 at 05:42
The visible error message had to come from some js file in a library, typically under `node_modules`. The find + grep command is simply a way to search all files for that exact text. There are many ways to do this. Read more here - https://stackoverflow.com/questions/16956810/how-to-find-all-files-containing-specific-text-string-on-linux — paneer_tikka, Feb 13 '23 at 11:16

Failed to load configuration of my react native project

3 Answers3