capitalone / react-native-pathjs-charts

Android and iOS charts based on react-native-svg and paths-js
Apache License 2.0
879 stars 260 forks source link

more Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. #209

Closed ManFerreira closed 6 years ago

ManFerreira commented 6 years ago

Encountering the error on the subject when using the default data provided for demo of pie chart.

Check the render method of G. This error is located at: in G (at Pie.js:143) ....

marzolfb commented 6 years ago

What do you have for versions of dependencies? What does npm list react react-native react-native-svg show? What does package.json look like in general?

rsailor commented 6 years ago

I'm having the same problem, but with using Bar.js.

My npm list looks like:

├── react@16.0.0
├── react-native@0.50.1
└─┬ react-native-pathjs-charts@0.0.31
  └── react-native-svg@5.4.2

package.json looks like:

...
  "dependencies": {
    "eslint": "4.10.0",
    "eslint-plugin-react": "7.4.0",
    "eslint-plugin-react-native": "3.1.0",
    "react": "16.0.0",
    "react-native": "0.50.1",
    "react-native-pathjs-charts": "0.0.31"
  },
  "devDependencies": {
    "babel-jest": "21.2.0",
    "babel-preset-react-native": "4.0.0",
    "eslint": "^4.10.0",
    "eslint-plugin-react": "^7.4.0",
    "eslint-plugin-react-native": "^3.1.0",
    "jest": "21.2.1",
    "react-test-renderer": "16.0.0"
  },
...

Any help appreciated, thanks.

marzolfb commented 6 years ago

This could be a conflict with the more recent version of react-native you have (0.50.1) and the older version of react-native-svg (5.4.2). I just published a new version of this library with the most updated/working dependencies. So, if you do a

rm -rf node_modules && npm cache clean && npm install

(or equivalent), and you do this:

npm list react-native-pathjs-charts react-native react react-native-svg

, you should now see something like:

├── react@16.0.0 
├── react-native@0.50.3 
└─┬ react-native-pathjs-charts@0.0.32 
  └── react-native-svg@5.5.1 

Does that help?

ManFerreira commented 6 years ago

Hi.

I've done "npm list react-native-pathjs-charts react-native react react-native-svg" and i'm currently like this:

├── react@16.0.0 ├── react-native@0.50.3 ├─┬ react-native-pathjs-charts@0.0.31 │ └── react-native-svg@5.4.2 └── react-native-svg@6.0.0

The issue remains. I see that react-native-pathjs-charts is @ 0.0.31 and yours @ 32 and i don't know why.

Any thing else i should do?

marzolfb commented 6 years ago

you need to remove the conflict you have for react-native-svg between version 5.4.2 and 6.0.0. In your package.json, do you have a direct reference to react-native-svg in dependencies? If so, does it have to be version 6.0.0? My advice is to edit your package.json based on the versions of dependencies I'm using (react-native-pathjs-charts@0.0.32 (which relies on react-native-svg@5.5.1), react@16.0.0 react-native@0.50.3) and then clean everything out with rm -rf && npm cache clean and then reinstall everything with npm install

ManFerreira commented 6 years ago

Hi.

Just did that.

package.json like this:

{ "name": "DBA_DSH", "version": "0.0.1", "private": true, "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", "test": "jest" }, "dependencies": { "art": "^0.10.1", "d3": "^4.11.0", "d3-shape": "^1.2.0", "react": "16.0.0", "react-minimal-pie-chart": "^3.0.1", "react-native": "0.50.3", "react-native-pathjs-charts": "0.0.32", "react-native-pie-chart": "^1.0.12", "react-navigation": "^1.0.0-beta.19" }, "devDependencies": { "babel-jest": "21.2.0", "babel-preset-react-native": "4.0.0", "jest": "21.2.1", "react-test-renderer": "16.0.0" }, "jest": { "preset": "react-native" } }

npm list:

├── react@16.0.0 ├── react-native@0.50.3 └─┬ react-native-pathjs-charts@0.0.32 └── react-native-svg@5.5.1

I'm getting the same error. :(

marzolfb commented 6 years ago

Hmm...even after duplicating your package.json with an app I have that displays displays the pie chart from the example app, I wasn't able to reproduce the same error. So, there must be something else going on (likely unrelated to this library). Since you have a variety of other charting libraries you are using, what happens as you start removing some of them and get down to just this chart library? Is there some combination of things that produces the error?

ManFerreira commented 6 years ago

Reinstalled everything.

Android platform 25 didn't had the license accepted. I did a sdkmanager --update, accepted the license and installed. Redeployed and its ok. I can see the example pie chart now.

Thanks!