React-native-router-flux: Error with the latest version of React Native 0.43.0

[diegorodriguesvieira]

Version

Tell us which versions you are using:

• react-native-router-flux v3.38.0
• react-native v0.43.0

Expected behaviour

Actual behaviour

http://paste.ubuntu.com/24313585/

Steps to reproduce

1. react-native init AppTest
2. install react-native-router-flux
3. import react-native-router-flux

[gabrielgomesferraz]

+1

[iscarecrow]

+1

[vincicat]

See #1717

[3gcodes]

+1

[sporteman]

+1

[Kaihuang724]

+1 - I've had to downgrade to [email protected] to get it working again

[diegorodriguesvieira]

I have had to downgrade to get it working again:

"react": "16.0.0-alpha.3"
"react-native": "v0.43.0-rc.3"
"react-test-renderer": "16.0.0-alpha.3"

[anuragsimgeker]

+1

[georgest]

+1

[windwang]

+1

[bowoekren]

+1

[jnbt]

+1

[andreecosta]

any solution on this? I want to update to use FlatLists.
Downgrading to 0.43.0-rc.3 didn't work for me.

[diegorodriguesvieira]

@itswaze I'm using FlatList...

My package.json
http://paste.ubuntu.com/24321269/

[andreecosta]

@diegorodriguesvieira That is not working for me... that's strange.
I get this error when I try to use those versions: "Duplicate module name: react-native-vector-icons"

[mykonwest]

+1, woof

[philohelp]

Same problem here :

error: bundling: UnableToResolveError: Unable to resolve module react/lib/ReactComponentWithPureRenderMixin from /test/node_modules/react-native/Libraries/react-native/react-native-implementation.js: Module does not exist in the module map or in these directories:
/test/node_modules/react-native/node_modules/react/lib
/test/node_modules/react/lib

• dreaming to get rid of nav-exprimental and get back to rnrf
• using flatlist everywhere in my app
• not skilled enough to help to solve that
• deeply depressed

[philohelp]

@diegorodriguesvieira I copy pasted you package.json and it works here too.

[philohelp]

Same issue on React-native navigation

[peixin]

Same problem

error: bundling: UnableToResolveError:
Unable to resolve module react/lib/ReactComponentWithPureRenderMixin from xxx/node_modules/react-addons-pure-render-mixin/index.js:
Module does not exist in the module map or in these directories: xxxx/node_modules/react/lib

[ShMcK]

It may be that React 16 alpha.3+ no longer supports mixins. The React team have hinted at deprecating mixins for a while now.

According to the PureRenderMixin docs:

Under the hood, the mixin implements shouldComponentUpdate, in which it compares the current props and state with the next ones and returns false if the equalities pass.

The solution may be something as simple as Dan Abramov's shallowEqual used in react-pure-render and replacing the mixin uses with the following.

shouldComponentUpdate() {
  return !shallowEqual(this.props, nextProps) || !shallowEqual(this.state, nextState);
}

This would accomplish the same goal: checking for reference and/or deep equality between the old and next props.

[satsuki0221]

Although it may not be good,
yarn add react-addons-pure-render-mixin
I think it will work.

[wjnxiang]

+1

[sushant6309]

+1

[EnriqueDev]

+1

[bilby91]

@satsuki0221 I tried that and it didn't work!

[satsuki0221]

This is necessary as well.
react-static-container

I confirmed that it works with these two
yarn add react-static-container react-addons-pure-render-mixin

[bilby91]

@satsuki0221 I still have the same problem with:

"react-addons-pure-render-mixin": "^15.4.2",
"react-static-container": "^1.0.1",

➜  app git:(bump-react-native-0.43.1) ✗ react-native bundle --platform ios --dev false --entry-file index.ios.js --bundle-output ios/main.jsbundle
Scanning 764 folders for symlinks in /Users/bilby91/Projects/app/node_modules (12ms)
Scanning 764 folders for symlinks in /Users/bilby91/Projects/app/node_modules (12ms)
Loading dependency graph, done.

Unable to resolve module `react/lib/ReactComponentWithPureRenderMixin` from `/Users/bilby91/Projects/app/node_modules/react-addons-pure-render-mixin/index.js`: Module does not exist in the module map or in these directories:
  /Users/bilby91/Projects/app/node_modules/react/lib
,   /Users/bilby91/node_modules/react/lib

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 packager cache: `rm -fr $TMPDIR/react-*` or `npm start --reset-cache`.

[satsuki0221]

@bilby91

I had done the following procedure

yarn upgrade react-native
yarn upgrade [email protected]
yarn add react-static-container react-addons-pure-render-mixin
yarn upgrade

[bilby91]

@satsuki0221 The npm upgrade did the trick. The problem was with the version of react-addons-pure-render-mixin, you need [email protected] in order to run correctly.

Thanks!

[bilby91]

So, temporal solution will be to add this to package.json:

"react-addons-pure-render-mixin": "^15.5.0",
"react-static-container": "^1.0.1",

[stefan0s]

it has dependency with "react-addons-pure-render-mixin" which it is removed from React 16.alpha3

[NightFarmer]

+1

[Silvercast]

+1

[wuyunqiang]

how to fix it,me to

[peixin]

npm install --save react-native-router-flux to fix, just now.

[stefan0s]

I don't see any progress, so we will uninstall and move on react-navigation

https://github.com/react-community/react-navigation

[jnbt]

@ShMcK Wouldn't be instrumenting React.PureComponent the more "future-ready" solution? https://facebook.github.io/react/docs/react-api.html#react.purecomponent

[ShMcK]

Definitely.

[Amurmurmur]

Still no fix?
This will require recoding and reimplementation of the navigation.
But well, react-navigation seems like a popular replacement. 👍

[jjdp]

@satsuki solution is working fine

[diegorodriguesvieira]

Has the problem been solved in version 0.44 of react-native?
I updated and it works ...

My current packages:

  "dependencies": {
    "react": "16.0.0-alpha.6",
    "react-native": "0.44.0",
    "react-native-router-flux": "^3.38.0",
  },
  "devDependencies": {
    "babel-jest": "20.0.0",
    "babel-preset-react-native": "1.9.1",
    "jest": "20.0.0",
    "react-test-renderer": "16.0.0-alpha.6"
  },

Something related to https://github.com/facebook/react-native/commit/a2cfea1934ab3682b2597a53de0b2b00a319832f ?