Issue with React Native project #1891

bolismauro · 2016-06-03T09:54:52Z

Hello everyone. I'm working on a React Native project and I receive this error every time I (or someone else, like a package in node_modules) import react.

This modules resolves to "<<PROJECT_ROOT>>/../../../node_modules/react/package.json", 
which is outside both your root directory and all of the entries in
the [include] section of your .flowconfig.
You should either add this directory to the [include] section of your .flowconfig,
move your .flowconfig file higher in the project directory tree, or move this package
under  your Flow root directory.: /path/to/react/node_modules/react-native/Libraries/ReactIOS/YellowBox.js:263

I honestly don't understand what's going on. Has anyone else this problem?
I searched in the past issues and I only find something related to third party libraries, but never to react itself

The text was updated successfully, but these errors were encountered:

Benjamin-Dobell · 2016-06-03T11:13:06Z

@bolismauro I just ran into this myself.

Removing:

# Flow has a built-in definition for the 'react' module which we prefer to use
# over the currently-untyped source
.*/node_modules/react/react.js
.*/node_modules/react/lib/React.js
.*/node_modules/react/lib/ReactDOM.js

from .flowconfig seems to resolve the issue. I'm new to React, React Native, Flow and even Node. So I don't pretend to understand exactly what is going on here 😉

bolismauro · 2016-06-03T11:22:01Z

It seems that now those errors are gone. I receive a massive amount of errors from react-native files though.
It is just me?

Benjamin-Dobell · 2016-06-03T11:27:17Z

Hmm, I don't get those. We may be on different versions of something:

$ flow version
Flow, a static type checker for JavaScript, version 0.25.0

There's actually a 0.26.0 out, ~~needs to be pushed to Homebrew. I'll submit a formula pull request shortly.~~ EDIT: Hmm, looks like the formula is up to date. I just must have forgot to upgrade.

Then my packages.json has:

  "dependencies": {
    "react": "^15.0.2",
    "react-native": "^0.26.3",
    "react-redux": "^4.4.5",
    "redux": "^3.5.2"
  },
  "devDependencies": {
    "flow": "^0.2.3",
    "flow-bin": "^0.26.0"
  }

Benjamin-Dobell · 2016-06-03T11:31:00Z

I just upgraded to the latest flow, 0.26.0. No, I'm still not seeing react-native errors.

bolismauro · 2016-06-03T11:32:04Z

I'm using RN 0.25.1 since I can't update it to the 0.26 because of a bug.
It may be that..
I'll wait for RN 0.27

ryyppy · 2016-06-03T14:18:32Z

Hey!
Can you please provide your .flowconfig ?
React-Native needs quite some configuration to make flow work properly ;-)

bolismauro · 2016-06-03T14:21:51Z

Sure,

[ignore]

# We fork some components by platform.
.*/*.web.js
.*/*.android.js

# Some modules have their own node_modules with overlap
.*/node_modules/node-haste/.*

# Ugh
.*/node_modules/babel.*
.*/node_modules/babylon.*
.*/node_modules/invariant.*

# Ignore react and fbjs where there are overlaps, but don't ignore
# anything that react-native relies on
.*/node_modules/fbjs/lib/Map.js
.*/node_modules/fbjs/lib/ErrorUtils.js

# Flow has a built-in definition for the 'react' module which we prefer to use
# over the currently-untyped source
#.*/node_modules/react/react.js
#.*/node_modules/react/lib/React.js
#.*/node_modules/react/lib/ReactDOM.js

.*/__mocks__/.*
.*/__tests__/.*

.*/commoner/test/source/widget/share.js

# Ignore commoner tests
.*/node_modules/commoner/test/.*

# See https://github.com/facebook/flow/issues/442
.*/react-tools/node_modules/commoner/lib/reader.js

# Ignore jest
.*/node_modules/jest-cli/.*

# Ignore Website
.*/website/.*

# Ignore generators
.*/local-cli/generator.*

# Ignore BUCK generated folders
.*\.buckd/

.*/node_modules/is-my-json-valid/test/.*\.json
.*/node_modules/iconv-lite/encodings/tables/.*\.json
.*/node_modules/y18n/test/.*\.json
.*/node_modules/spdx-license-ids/spdx-license-ids.json
.*/node_modules/spdx-exceptions/index.json
.*/node_modules/resolve/test/subdirs/node_modules/a/b/c/x.json
.*/node_modules/resolve/lib/core.json
.*/node_modules/jsonparse/samplejson/.*\.json
.*/node_modules/json5/test/.*\.json
.*/node_modules/ua-parser-js/test/.*\.json
.*/node_modules/builtin-modules/builtin-modules.json
.*/node_modules/binary-extensions/binary-extensions.json
.*/node_modules/url-regex/tlds.json
.*/node_modules/joi/.*\.json
.*/node_modules/isemail/.*\.json
.*/node_modules/tr46/.*\.json


[include]

[libs]
node_modules/react-native/Libraries/react-native/react-native-interface.js
node_modules/react-native/flow
flow/

[options]
module.system=haste

esproposal.class_static_fields=enable
esproposal.class_instance_fields=enable
unsafe.enable_getters_and_setters=true

munge_underscores=true

module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'

suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FixMe

suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-4]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-4]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
suppress_comment=\\(.\\|\n\\)*\\$Ignore

[version]
>=0.24.2

I changed these

# Flow has a built-in definition for the 'react' module which we prefer to use
# over the currently-untyped source
#.*/node_modules/react/react.js
#.*/node_modules/react/lib/React.js
#.*/node_modules/react/lib/ReactDOM.js

based on @Benjamin-Dobell comment

rajapanidepu · 2016-06-09T23:36:46Z

I am facing the same issue.

chetstone · 2016-06-13T00:38:21Z

Make sure you're using a .flowconfig from the version of react-native you're using and install the same version of flow that's mentioned in the [version] section of that .flowconfig

bolismauro · 2016-06-16T15:48:50Z

So this is the structure

/
 /react
   - .flowconfig
   /node_modules
 /other stuff

I moved flowconfig file in the root folder but nothing has changed. I still have a lot (> 72) errors on react native. I've also tried to change the paths on flowconfig to take into account the react folder but nothing has changed

Here is a screen of the nuclide errors

deeptiagrawa · 2016-06-29T17:51:21Z

I am getting these errors as well.

node_modules/react-native/Libraries/CustomComponents/NavigationExperimental/NavigationLegacyNavigator.js:48
 48: const React = require('React');
                   ^^^^^^^^^^^^^^^^ This modules resolves to "<<PROJECT_ROOT>>/../../../node_modules/react/package.json",
 which is outside both your root directory and all of the entries in the [include] section of your 
.flowconfig. You should either add this directory to the [include] section of your .flowconfig, 
move your .flowconfig file higher in the project directory tree, or move this package under
your Flow root directory.

Below are my versions for various modules:

react-native --> 0.25.1 
flow version is --> 0.24.2
npm --> 3.8.3
node --> 5.8.0

I tried all the suggestions provided in this issue. Also it's creating problem only in my machine and working fine in others. I assume there is no problem with .flowconfig file and some configuration issue on my machine.

Benjamin-Dobell · 2016-06-30T00:21:09Z

@deeptiagrawa You're definitely not the only one getting this. You are running some out-dated software, but I'm still receiving these same errors every update. I still have to comment out:

# Flow has a built-in definition for the 'react' module which we prefer to use
# over the currently-untyped source
#.*/node_modules/react/react.js
#.*/node_modules/react/lib/React.js
#.*/node_modules/react/lib/ReactDOM.js

in .flowconfig.

$ react-native --version
react-native-cli: 1.0.0
react-native: 0.28.0
$ flow version
Flow, a static type checker for JavaScript, version 0.26.0

simonsmith · 2016-09-20T08:57:29Z

Is anyone else still experiencing these errors? I just upgraded to 0.33 and have many of them:

node_modules/react-native/Libraries/Components/Touchable/TouchableBounce.js:14
 14: var Animated = require('Animated');
                    ^^^^^^^^^^^^^^^^^^^ This modules resolves to "<<PROJECT_ROOT>>/../../../node_modules/animated/package.json", which is outside both your root directory and all of the entries in the [include] section of your .flowconfig. You should either add this directory to the [include] section of your .flowconfig, move your .flowconfig file higher in the project directory tree, or move this package under your Flow root directory.

node_modules/react-native/Libraries/CustomComponents/NavigationExperimental/NavigationCard.js:35
 35: const Animated = require('Animated');
                      ^^^^^^^^^^^^^^^^^^^ This modules resolves to "<<PROJECT_ROOT>>/../../../node_modules/animated/package.json", which is outside both your root directory and all of the entries in the [include] section of your .flowconfig. You should either add this directory to the [include] section of your .flowconfig, move your .flowconfig file higher in the project directory tree, or move this package under your Flow root directory.

node_modules/react-native/Libraries/CustomComponents/NavigationExperimental/NavigationCardStackPanResponder.js:15
 15: const Animated = require('Animated');
                      ^^^^^^^^^^^^^^^^^^^ This modules resolves to "<<PROJECT_ROOT>>/../../../node_modules/animated/package.json", which is outside both your root directory and all of the entries in the [include] section of your .flowconfig. You should either add this directory to the [include] section of your .flowconfig, move your .flowconfig file higher in the project directory tree, or move this package under your Flow root directory.

Mlobaievskyi · 2016-09-24T09:01:36Z

I had the same errors. I changed [libs] pathes to react-native modules and now everything is ok.
Here is my .flowconfig file

[ignore]

# We fork some components by platform.
.*/*[.]android.js

# Ignore templates with `@flow` in header
.*/local-cli/generator.*

# Ignore malformed json
.*/node_modules/y18n/test/.*\.json

# Ignore the website subdir
<PROJECT_ROOT>/website/.*

# Ignore BUCK generated dirs
<PROJECT_ROOT>/\.buckd/

# Ignore unexpected extra @providesModule
.*/node_modules/commoner/test/source/widget/share.js

# Ignore duplicate module providers
# For RN Apps installed via npm, "Libraries" folder is inside node_modules/react-native but in the source repo it is in the root
.*/Libraries/react-native/React.js
.*/Libraries/react-native/ReactNative.js
.*/node_modules/jest-runtime/build/__tests__/.*

# Ignore node_modules
.*/node_modules/react/node_modules/fbjs/.*

[include]

[libs]
node_modules/react-native/Libraries/react-native/react-native-interface.js
node_modules/react-native/flow
flow/


[options]
module.system=haste

esproposal.class_static_fields=enable
esproposal.class_instance_fields=enable
esproposal.decorators=ignore

experimental.strict_type_args=true

munge_underscores=true

module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'

suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FixMe

suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-2]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-2]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy

unsafe.enable_getters_and_setters=true

[version]
^0.32.0

simonsmith · 2016-09-26T09:01:35Z

I'm using a default installation of react-native 0.34.0 and I still see this error. Starting to wonder if it's tied to my machine somehow

matthamil · 2017-02-03T17:47:31Z

Using react-native v0.41 and Flow v0.37.0 I get the same "require" bugs as mentioned above:

kiddo13 · 2017-03-08T09:00:16Z

Bump into this error with react-native: "0.42.0" and flow-bin: "0.38.0"

Ignore these files inside .flowconfig

[ignore]
/* ... */

.*/node_modules/react-native-experimental-navigation/.*
.*/Libraries/Components/StaticContainer.js

/* ... */

[version]
0.38.0

alpcanaydin · 2017-03-29T08:38:54Z

I get the same problem with react-native 0.42.0 and flow-bin 0.38.0. Is there any solution for this?

rebelliard · 2017-04-06T17:33:35Z

Ran into this with react-native: 0.43.1 and flow-bin:0.43.1:

You can see the generated .flowconfig here.

matthamil · 2017-05-11T04:55:22Z

For anyone who still needs help with this, I have fixed the issue on my machine:

Instead of running flow with flow; test $? -eq 1 -o $? -eq 2 like the getting started docs say, use:

./node_modules/.bin/flow app; test $? -eq 1 -o $? -eq 2 where app is the main directory for your app code.

I'm also running RN 0.44.0 and flow-bin 0.42.0

asolove · 2017-08-28T19:12:29Z

Looks like there is a known way to do this now, so I'm going to close the issue. Feel free to object if there's something else here that should be fixed in the flow codebase and I can reopen.

baldursson · 2017-12-29T16:05:19Z

@asolove What is the known way? I didn't find a solution in this thread. I still get about 50 errors from React Native libraries, like:

Error: node_modules/react-native/Libraries/Animated/src/Easing.js:65
 65:   static step0(n) {
                    ^ n. Missing annotation

strizzwald · 2018-01-07T19:10:57Z

Also got some errors today with react-native: 0.50.3 and flow-bin: 0.63.1. Doing yarn run flow throws
.flowconfig:72 Unsupported option specified! error.

baldursson · 2018-01-07T19:18:25Z

I realized the importance of keeping the Flow version in sync with React Native. Check the .flowconfig file of the React Native version you are using, e.g https://github.com/facebook/react-native/blob/v0.51.0/.flowconfig. Then make sure it matches your version of flow-bin. By downgrading flow-bin to 0.57.3 I got rid of 100+ errors.

mwalkerwells mentioned this issue Sep 10, 2016

Presence of .flowconfig causing module resolve issues gcanti/flow-static-land#21

Closed

vkurchatkin added react react-native labels Oct 27, 2016

asolove closed this as completed Aug 28, 2017

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Issue with React Native project #1891

Issue with React Native project #1891

bolismauro commented Jun 3, 2016 •

edited

Loading

Benjamin-Dobell commented Jun 3, 2016

bolismauro commented Jun 3, 2016

Benjamin-Dobell commented Jun 3, 2016 •

edited

Loading

Benjamin-Dobell commented Jun 3, 2016

bolismauro commented Jun 3, 2016

ryyppy commented Jun 3, 2016 •

edited

Loading

bolismauro commented Jun 3, 2016

rajapanidepu commented Jun 9, 2016

chetstone commented Jun 13, 2016

bolismauro commented Jun 16, 2016 •

edited

Loading

deeptiagrawa commented Jun 29, 2016 •

edited

Loading

Benjamin-Dobell commented Jun 30, 2016 •

edited

Loading

simonsmith commented Sep 20, 2016

Mlobaievskyi commented Sep 24, 2016 •

edited

Loading

simonsmith commented Sep 26, 2016

matthamil commented Feb 3, 2017

kiddo13 commented Mar 8, 2017 •

edited

Loading

alpcanaydin commented Mar 29, 2017

rebelliard commented Apr 6, 2017 •

edited

Loading

matthamil commented May 11, 2017 •

edited

Loading

asolove commented Aug 28, 2017

baldursson commented Dec 29, 2017

strizzwald commented Jan 7, 2018 •

edited

Loading

baldursson commented Jan 7, 2018

Issue with React Native project #1891

Issue with React Native project #1891

Comments

bolismauro commented Jun 3, 2016 • edited Loading

Benjamin-Dobell commented Jun 3, 2016

bolismauro commented Jun 3, 2016

Benjamin-Dobell commented Jun 3, 2016 • edited Loading

Benjamin-Dobell commented Jun 3, 2016

bolismauro commented Jun 3, 2016

ryyppy commented Jun 3, 2016 • edited Loading

bolismauro commented Jun 3, 2016

rajapanidepu commented Jun 9, 2016

chetstone commented Jun 13, 2016

bolismauro commented Jun 16, 2016 • edited Loading

deeptiagrawa commented Jun 29, 2016 • edited Loading

Benjamin-Dobell commented Jun 30, 2016 • edited Loading

simonsmith commented Sep 20, 2016

Mlobaievskyi commented Sep 24, 2016 • edited Loading

simonsmith commented Sep 26, 2016

matthamil commented Feb 3, 2017

kiddo13 commented Mar 8, 2017 • edited Loading

alpcanaydin commented Mar 29, 2017

rebelliard commented Apr 6, 2017 • edited Loading

matthamil commented May 11, 2017 • edited Loading

asolove commented Aug 28, 2017

baldursson commented Dec 29, 2017

strizzwald commented Jan 7, 2018 • edited Loading

baldursson commented Jan 7, 2018

bolismauro commented Jun 3, 2016 •

edited

Loading

Benjamin-Dobell commented Jun 3, 2016 •

edited

Loading

ryyppy commented Jun 3, 2016 •

edited

Loading

bolismauro commented Jun 16, 2016 •

edited

Loading

deeptiagrawa commented Jun 29, 2016 •

edited

Loading

Benjamin-Dobell commented Jun 30, 2016 •

edited

Loading

Mlobaievskyi commented Sep 24, 2016 •

edited

Loading

kiddo13 commented Mar 8, 2017 •

edited

Loading

rebelliard commented Apr 6, 2017 •

edited

Loading

matthamil commented May 11, 2017 •

edited

Loading

strizzwald commented Jan 7, 2018 •

edited

Loading