react-native: Can't import js file in parent folder

Description

Can’t import js file in parent folder

Reproduction

import {ReactNativeCron} from ‘…/ReactNativeCron’ gives error: Directory /Users/nikos/WebstormProjects/react-native-cron/ReactNativeCron doesn't exist

If I move the file to ./ReactNativeCron it works

  • React Native version: “react-native”: “0.40.0”

  • Platform: iOS

  • Operating System:MacOS

see https://github.com/QuantumInformation/react-native-cron/commit/ea7fdf2b2d8e280d630baf855da4b4d888772195

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 33 (2 by maintainers)

Most upvoted comments

@hnryjms and I ran in to this as well. It is an issue for us because our react-native app is a subdirectory of our repo that contains a web app and server code. We have a lib directory that contains useful JS code for all projects, and would like to be able to use it everywhere. We could make the lib directory a local NPM module and install it into both projects, but that makes local development somewhat annoying.

The solution we found was to add the file called rn-cli.config.js at the Mobile app’s root which is the default file the react-native packager looks at for specifying run configurations.

const Path = require('path');

module.exports = {
    getProjectRoots: () => [ __dirname, Path.join(__dirname, "..") ]
};

Can someone reopen this ticket?

@brentvatne how should we be references shared libraries that might be used in either multiple react-native apps / a react web app where both the libraries and apps are being developed at the same time?

I’ve been searching for the for 30 minutes now and can’t find a working solution on StackOverflow / in other bugs etc. If it is possible, it seems like this deserves docs?

@gensc004 do you have a simple working example of this or copy of code you can share of how you import the packages + the directory structure? I can’t seem to get your solution to work either

@MPiwowarski check here for an example project, hope this helps! (and that it’s actually what you’re trying to do 😁)

Edit: I should point out for haul, which has been suggested, realize that the lack of support for delta bundles could cause headaches down the road on Android, for instance react-native-navigation proved incompatible with haul because of the lack of delta bundle support.

I’ve built the project numerous times. I’ve set up from-scratch using both create-react-native-app and react-native init, in both cases I’m unable to require modules outside the respective root directories. Adding the rn-cli.config.js did not help, even running npm link didn’t work. The only thing that vaguely resembled a solution was manually copying my modules to node_modules of the mobile app, which obviously is no solution to this.

@ericketts thank you very much! It works properly. I’ve also added some sample react native component to your shared folder and imported it in App.js in rn folder and works fine 😃 Do you think your solution works also with Expo? Cheers