Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

unable to resolve path outside root directory #391

Open
abanik0831 opened this issue Apr 11, 2019 · 7 comments
Open

unable to resolve path outside root directory #391

abanik0831 opened this issue Apr 11, 2019 · 7 comments
Assignees

Comments

@abanik0831
Copy link

abanik0831 commented Apr 11, 2019

Do you want to request a feature or report a bug?

Report a bug

What is the current behavior?

unable to resolve path above root directory

If the current behavior is a bug, please provide the steps to reproduce and a minimal repository on GitHub that we can yarn install and yarn test.

create a react native project (all folders inside native directory). Create a new src directory sibling to native. Create any JS file within the src folder`

Now, inside App.js file inside your native folder try accessing the JS file from src dir --

import file from '../src/file.js'

error seen:

error: bundling failed: Error: Unable to resolve module `../src/help/me` from `/Users/abanik/project/react-native-starter/native/App.js`: The module `../src/help/me` could not be found from `/Users/abanik/project/react-native-starter/native/App.js`. Indeed, none of these files exist:
  * `/Users/abanik/project/react-native-starter/src/help/me(.native||.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`
  * `/Users/abanik/project/react-native-starter/src/help/me/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`
    at ModuleResolver.resolveDependency (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/node-haste/DependencyGraph.js:283:16)
    at Object.resolve (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/lib/transformHelpers.js:261:42)
    at dependencies.map.result (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:399:31)
    at Array.map (<anonymous>)
    at resolveDependencies (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:18)
    at /Users/abanik/project/react-native-starter/native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:269:33
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/abanik/project/react-native-starter/native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24)

What is the expected behavior?

able to resolve path.

Please provide your exact Metro configuration and mention your Metro, node, yarn/npm version and operating system.

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

React Native Environment Info:
    System:
      OS: macOS 10.14.3
      CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
      Memory: 191.12 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 8.11.4 - ~/.nvm/versions/node/v8.11.4/bin/node
      Yarn: 1.10.1 - /usr/local/bin/yarn
      npm: 5.6.0 - ~/.nvm/versions/node/v8.11.4/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
    IDEs:
      Android Studio: 3.3 AI-182.5107.16.33.5314842
      Xcode: 10.2/10E125 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.3 => 16.8.3 
      react-native: 0.59.1 => 0.59.1 
    npmGlobalPackages:
      react-native-cli: 2.0.1

git link: https://github.com/abanik0831/nativebug

@moonrailgun
Copy link

Same issue for me .
I cant show image which without projectRoot although i can require it and get a id

Hope to fix it, its not a issue for old one.

@rob-johansen
Copy link

I have the same issue with React Native 0.60. What's really strange is I updated my metro.config.js like this to watch my sibling folder...

const path = require('path')

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

module.exports = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: false,
      },
    }),
  },
  resolver: {
    extraNodeModules: {
      "react": path.resolve(__dirname, "node_modules/react"),
      "react-native": path.resolve(__dirname, "node_modules/react-native")
    }
  },
  projectRoot: path.resolve(__dirname),
  watchFolders: [
    path.resolve(__dirname, "../src")
  ]
}

...and now when I run react-native start from the root of my project, it says it's looking in my folder for JS files:

Looking for JS files in
   /Users/rob/learn/react-native/AwesomeProject
   /Users/rob/learn/react-native/src

But when I try to import my module in App.js like so...

import React, { Component } from 'react';
import { Text, View } from 'react-native';

import Pizza from 'pizza' // This is a pizza.js file sitting in ../src

export default class HelloWorldApp extends Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
        <Text>Hello, world!!</Text>
      </View>
    )
  }
}

...the bundler spits this out:

error: bundling failed: Error: Unable to resolve module `pizza` from `/Users/rob/learn/react-native/AwesomeProject/App.js`: Module `pizza` does not exist in the Haste module map

This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
  1. Clear watchman watches: `watchman watch-del-all`.
  2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
  3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.
  4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.
    at ModuleResolver.resolveDependency (/Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:183:15)
    at ResolutionRequest.resolveDependency (/Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/node-haste/DependencyGraph.js:283:16)
    at Object.resolve (/Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/lib/transformHelpers.js:264:42)
    at /Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/DeltaBundler/traverseDependencies.js:399:31
    at Array.map (<anonymous>)
    at resolveDependencies (/Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:18)
    at /Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/DeltaBundler/traverseDependencies.js:269:33
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/rob/learn/react-native/AwesomeProject/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24)
 BUNDLE  [android, dev] ./index.js ▓▓▓▓▓▓▓▓▓░░░░░░░ 56.9% (322/427), failed.

I've tried all the things mentioned in that output, but none of them worked.

@rochapablo
Copy link

I'm also having problem to run a example module that I'm building from scratch.

Loading dependency graph, done.
error: bundling failed: Error: Unable to resolve module `react-native-my-module` from `/example/App.js`: Module `react-native-my-module` does not exist in the Haste module map

This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
  1. Clear watchman watches: `watchman watch-del-all`.
  2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
  3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.
  4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.
    at ModuleResolver.resolveDependency (/example/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:183:15)
    at ResolutionRequest.resolveDependency (/example/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/example/node_modules/metro/src/node-haste/DependencyGraph.js:283:16)
    at Object.resolve (/example/node_modules/metro/src/lib/transformHelpers.js:264:42)
    at dependencies.map.result (/example/node_modules/metro/src/DeltaBundler/traverseDependencies.js:399:31)
    at Array.map (<anonymous>)
    at resolveDependencies (/example/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:18)
    at /example/node_modules/metro/src/DeltaBundler/traverseDependencies.js:269:33
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/example/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24)
 BUNDLE  [ios, dev] ./index.js ▓▓░░░░░░░░░░░░░░ 15.4% (117/298), failed.

my app package.json

"react": "16.8.6",
"react-native": "0.60.5",
"react-native-my-module": "file:../"

my module package.json

{
  "name": "react-native-my-module",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "keywords": [
    "react-native"
  ],
  "author": "",
  "license": "",
  "peerDependencies": {
    "react-native": "^0.41.2",
    "react-native-windows": "0.41.0-rc.1"
  }
}

Sometimes in other projects that I'm working on, I get this error and than I do this and it work. But now I did it for many times but it always the same error.

@jamesruan
Copy link

Same problem for me to use a local reference module which require react to be peerDependencies.

@ariccio
Copy link

ariccio commented Jan 9, 2022

Honestly, this is a very surprising problem for first time react-native devs! Especially if you're spinning up a react-native app and trying to share code with a react web app. I'm spoiled by being able to include C++ headers from any path, I guess.

@developerdanx
Copy link

Any update of this issue ?

@migueldaipre
Copy link

Hey guys, any news about this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants