EzDevInfo.com

react-d3

Modular React charts made with d3.js

Adding react-d3 to my react-native app causes a error

I am quite new to reactJS, and have just started working with react-native.

I added react-d3 using npm install --save-dev react-d3 but when I refresh or rebuild the app I am getting:

TypeError: undefined is not an object
(evaluating 
'require('BatchedBridge').flushedQueue')

{
 "line":1 ,
 "column": 25
}

If I remove or uninstall react-d3 from the library it works fine.

Thanks


Source: (StackOverflow)

Upgrading React to 0.13.2 causes: "Uncaught TypeError: Cannot read property '_currentElement' of null"

I upgraded my React version from 0.12.2 to 0.13.2 and my React-Router from 0.12.4 to 0.13.2. Doing just those two upgrades and nothing else, I now get the following error when I load my webpage/app:

Uncaught TypeError: Cannot read property '_currentElement' of null

Any ideas what might be causing this? I have seem some references to a potential React-Router bug, but nothing definitive.

The specific line that causes the error is:

ReactRef.detachRefs(internalInstance, internalInstance._currentElement);

Update 1: I also just upgraded reactify from version 1.0.0 to 1.1.0 and react-router-bootstrap (which I'm not actually using yet) from 0.9.1 to 0.13.0 based on @BinaryMuse's comments - no change.

Update 2: After further testing, I have narrowed this down to an issue with react-d3. Disabling the react-d3 code from my site causes the error to go away. I am removing the routing code to make the post more concise since I am now fairly confident that react-router is not causing this issue.

Update 3: Thanks to @CoryDanielson for creating the new tag for react-d3.

package.json

{
  "author": "me",
  "name": "my project",
  "description": "my awesome project",
  "version": "0.1.0",
  "dependencies": {
    "bootstrap": "^3.3.2",
    "d3": "^3.5.5",
    "font-awesome": "^4.3.0",
    "jquery": "^2.1.3",
    "react": "^0.13.2",
    "react-bootstrap": "^0.21.0",
    "react-d3": "^0.3.1",
    "react-router": "^0.13.2",
    "react-router-bootstrap": "~0.13.0",
    "reflux": "^0.2.6",
    "uuid": "^2.0.1"
  },
  "devDependencies": {
    "browser-sync": "^2.2.2",
    "browserify": "^9.0.3",
    "del": "^1.1.1",
    "envify": "^3.4.0",
    "gulp": "^3.8.11",
    "gulp-css-url-adjuster": "^0.2.3",
    "gulp-jshint": "^1.9.2",
    "gulp-minify-css": "^0.5.1",
    "gulp-sourcemaps": "^1.5.0",
    "gulp-uglify": "^1.1.0",
    "gulp-util": "^3.0.4",
    "gulp-watch": "^4.1.1",
    "reactify": "~1.1.0",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.0.0",
    "watchify": "^2.4.0"
  },
  "browserify": {
    "transform": [
      [
        "reactify",
        {
          "es6": false
        }
      ]
    ]
  },
}

Source: (StackOverflow)

Advertisements