Error: Unable to resolve module, could not be found within the project

user_5339829 0
Viewed 6374

I have been trying to include a React native library (Local Library) to the React Native app.

So I installed it using

npm install library-path

Then I run

npm link libraryname

I can see the package in the node_modules of the mainProject. Also, in package.json, I can see the dependencies:

"dependencies": {
    "react": "16.13.1",
    "react-native": "0.63.2",
    "react-native-first-library": "file:../react-native-first-library",
    "react-native-toast-message": "^1.3.3",
    "react-native-webview": "^10.8.3"
  },

react-native-first-library is my react module.

I have done

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

But still, it is not working. I don't know why these things are so complex.

react-native
4 Answers

I had to integrate a custom library once. I just created a folder at root level customLibs and I put the folder of my library into. Then in the package.json I specified "myLib": "file:./customLibs/myLib"

I'm not sure but in your package.json the path should not be file:../react-native-first-library with two dots but surely with one dot.

And at the end just yarn or npm i

user_115625000

I noticed react-native-webview was not found in node_modules/, so I did npm install react-native-webview. And it was fixed.

user_16159780

A lot of confused answers here. when you install a local package via npm install 'path/to/local/package', or in your package.json with 'file://path/to/local/package', npm links to the local package without copying. metro bundler does not know how to resolve these locally linked packages properly. you can update metro bundler config to do this.

example from my metro.config.js:


// paths to local packages
const localPackagePaths = [
  '/Users/alexchoi/package-name',
]

module.exports = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
  },
  resolver: {
      nodeModulesPaths: [...localPackagePaths], // update to resolver
  },
  watchFolders: [...localPackagePaths], // update to watch
};

and then metro bundler will know how to resolve these locally linked packages.

make sure you restart metro bundler npx react-native start

user_16846140

just do one thing

1). copy the local library folder and paste it into the node_modules of the react native project..

example =>

i have a library say react-native-test

=> after installing it in a react native project I can see that package.json file has added a dependency like "react-native-test": "file:../react-native-test",

but i got an error as soon as I ran the project displaying unable to resolve module

=> just copy the react-native-test folder and paste it into the react native project's node_modules folder and do npm install again

user_108152100
Related