React-redux: update to 5.0.3 -- `Right-hand side of 'instanceof' is not callable`
hi there, the recent update from 5.0.2 to 5.0.3 broke the build on a project of mine.
here's the error that we're getting:
webpack-bundle-0674cf6….js:8 Uncaught TypeError: Right-hand side of 'instanceof' is not callable
at o (webpack-bundle-0674cf6….js:8)
at Object.run (webpack-bundle-0674cf6….js:8)
at c.initSelector (webpack-bundle-0674cf6….js:8)
at new c (webpack-bundle-0674cf6….js:8)
at f._constructComponentWithoutOwner (webpack-bundle-0674cf6….js:7)
at f._constructComponent (webpack-bundle-0674cf6….js:7)
at f.mountComponent (webpack-bundle-0674cf6….js:7)
at Object.mountComponent (webpack-bundle-0674cf6….js:5)
at f.performInitialMount (webpack-bundle-0674cf6….js:7)
at f.mountComponent (webpack-bundle-0674cf6….js:7)
apologies for the lack of detail, let me know if there's anything i can do to clarify. thx!
data-doge
All 11 comments
@data-doge
Hi, I have same issue when I build only for production with webpack. Kindly, any update??
okmttdhr
on 9 Mar 2017
@okmttdhr
ey, we just locked react-redux to 5.0.2 and moved on.
wish i could be more helpful!
data-doge
on 12 Mar 2017
Thank you @data-doge !
I found the solution; (in my case) I needed to remove preloadedState from createStore, because it was not a object with the same shape as the keys.
// before
const preloadedState = {}
const store = createStore(
rootReducer,
preloadedState,
applyMiddleware(sagaMiddleware)
);
// after
const store = createStore(
rootReducer,
applyMiddleware(sagaMiddleware)
);
@data-doge Any chance you can reproduce that error with source maps enabled so we know what line of code is actually causing the problem? That stack trace is from a minified bundle.
@jimbolla Any idea what's up here?
timdorr
on 13 Mar 2017
Ehhh. I'm gonna need a more helpful unminified stacktrace at least.
jimbolla
on 13 Mar 2017
I'm seeing the same issue in production with the same minified stack trace as @data-doge. I also temporarily fixed this by locking to v5.0.2.
I tried enabling source maps but I'm not seeing an unminified stack trace. Does anyone have any other suggestions for moving forward on this issue?
daschi
on 20 Apr 2017
Can anyone provide an example repo?
timdorr
on 20 Apr 2017
Got this error after adding react-redux 5.0.6 package - happening only if built with NODE_ENV="production"
patrik7
on 6 Nov 2017
We just ran into this error, which appears to be from a bad minification of redux. In our case, it was the result of uglifying already minified code.
This piece of code:
function makeSelectorStateful(sourceSelector, store) {
// wrap the selector in an object that tracks its results between runs.
const selector = {
run: function runComponentSelector(props) {
try {
const nextProps = sourceSelector(store.getState(), props)
if (nextProps !== selector.props || selector.error) {
selector.shouldComponentUpdate = true
selector.props = nextProps
selector.error = null
}
} catch (error) {
selector.shouldComponentUpdate = true
selector.error = error
}
}
}
minified to:
function c(e, t) {
var o = {
run: function(n) {
try {
var r = e(t.getState(), n);
(r !== o.props || o.error) && (o.shouldComponentUpdate = !0,
o.props = r,
o.error = null)
} catch (s) {
o.shouldComponentUpdate = !0,
o.error = s
}
}
};
return o
}
and then on the second pass of uglifying became:
function c(e, t) {
var o = {
run: function(e) {
try {
var n = r(t.getState(), e);
(n !== o.props || o.error) && (o.shouldComponentUpdate = !0,
o.props = n,
o.error = null)
} catch (r) {
o.shouldComponentUpdate = !0,
o.error = r
}
}
};
return o
}
... r in var n = r(t.getState(), e);, which should have been the same variable as e in the top-level function now pointed to this function:
function r(e, t) {
if (!(e instanceof t))
throw new TypeError("Cannot call a class as a function")
}
which is this function:
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
I don't understand how the minifier could mangle this so badly, but it caused a completely random call into _classCallCheck which is what was throwing our error. Removing the second uglify fixed our problem.
dule
on 5 Dec 2017
In my case, it was also caused by running second uglification. Removing uglification from Play asset pipeline fixed the problem.
patrik7
on 6 Dec 2017
Ah, that seems to be the culprit. ASTs are hard!
timdorr
on 6 Dec 2017
Related issues
julienvincent
·
4Comments
nainardev
·
3Comments
psbanka
·
4Comments
esayemm
·
3Comments
iammerrick
·
3Comments
Most helpful comment
We just ran into this error, which appears to be from a bad minification of redux. In our case, it was the result of uglifying already minified code.
This piece of code:
function makeSelectorStateful(sourceSelector, store) { // wrap the selector in an object that tracks its results between runs. const selector = { run: function runComponentSelector(props) { try { const nextProps = sourceSelector(store.getState(), props) if (nextProps !== selector.props || selector.error) { selector.shouldComponentUpdate = true selector.props = nextProps selector.error = null } } catch (error) { selector.shouldComponentUpdate = true selector.error = error } } }minified to:
function c(e, t) { var o = { run: function(n) { try { var r = e(t.getState(), n); (r !== o.props || o.error) && (o.shouldComponentUpdate = !0, o.props = r, o.error = null) } catch (s) { o.shouldComponentUpdate = !0, o.error = s } } }; return o }and then on the second pass of uglifying became:
function c(e, t) { var o = { run: function(e) { try { var n = r(t.getState(), e); (n !== o.props || o.error) && (o.shouldComponentUpdate = !0, o.props = n, o.error = null) } catch (r) { o.shouldComponentUpdate = !0, o.error = r } } }; return o }...
rinvar n = r(t.getState(), e);, which should have been the same variable asein the top-level function now pointed to this function:function r(e, t) { if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function") }which is this function:
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }I don't understand how the minifier could mangle this so badly, but it caused a completely random call into
_classCallCheckwhich is what was throwing our error. Removing the second uglify fixed our problem.