我有一个React应用程序,而服务器端渲染我得到错误,我无法破译:
TypeError: Cannot read property 'data' of undefined
at t.default (/code/server.bundle.js:1:239027)
at /code/node_modules/react-dom/lib/ReactCompositeComponent.js:306:16
at measureLifeCyclePerf (/code/node_modules/react-dom/lib/ReactCompositeComponent.js:75:12)
at ReactCompositeComponentWrapper._constructComponentWithoutOwner (/code/node_modules/react-dom/lib/ReactCompositeComponent.js:305:14)
at ReactCompositeComponentWrapper._constructComponent (/code/node_modules/react-dom/lib/ReactCompositeComponent.js:280:21)
at ReactCompositeComponentWrapper.mountComponent (/code/node_modules/react-dom/lib/ReactCompositeComponent.js:188:21)
at Object.mountComponent (/code/node_modules/react-dom/lib/ReactReconciler.js:46:35)
at ReactDOMComponent.mountChildren (/code/node_modules/react-dom/lib/ReactMultiChild.js:238:44)
at ReactDOMComponent._createContentMarkup (/code/node_modules/react-dom/lib/ReactDOMComponent.js:653:32)
at ReactDOMComponent.mountComponent (/code/node_modules/react-dom/lib/ReactDOMComponent.js:520:29)
如果我从源地图或其他东西得到一些堆栈错误,我会很高兴。
我怎样才能做到这一点?
这是我用于服务器端呈现的代码:
const store = configureStore();
const app = express();
app.use(compression());
app.use(express.static(path.join(__dirname, 'public'), {index: false}));
app.get('*', (req, res) => {
match({routes: routes(store), location: req.url}, (err, redirect, props) => {
if (err) {
res.status(500).send(err.message)
} else if (redirect) {
res.redirect(redirect.pathname + redirect.search)
} else if (props) {
const appHtml = renderToString(
<Provider store={store}>
<RouterContext store={store} {...props} />
</Provider>
);
res.send(template({
body: appHtml
}))
} else {
res.status(404).send('Not Found')
}
})
});
const PORT = process.env.PORT || 8080;
app.listen(PORT, function () {
console.log('Production Express server running at localhost:' + PORT)
});
我已将webpack配置为为我的bundle.js生成源映射,但它们仅在浏览器中调试时才有效。