Closed
Description
Hi,
On react-i18next >= 1.5.0, universal rendering is broken.
Error: Invariant Violation: React DOM tree root should always have a node reference.
Related to this issue react issue, this line might be the cause.
A rerender occur on server-side because of a setState inside the componentWillMount hook
My server side setup :
match({ routes, location}, (error, redirectLocation, renderProps) => {
if (error) {
res.status(500).send(error.message)
} else if (redirectLocation) {
res.redirect(302, redirectLocation.pathname + redirectLocation.search)
} else if (renderProps) {
loadNamespaces(Object.assign({}, renderProps, {i18n}))
.then(() => {
const isNotFound = renderProps.routes.find((route) => {
return route.status === 404
})
const locale = req.language
const locales = res.locals.locales
const component = (
<I18nextProvider i18n={req.i18n}>
<RouterContext
{...renderProps}
/>
</I18nextProvider>
)
res.status(isNotFound ? 404 : 200).send('<!doctype html>\n' +
renderToStaticMarkup(<Html assets={webpack_isomorphic_tools.assets()}
component={component} />))
})
} else {
res.status(404).send('Not found')
}
}) // html.js
render()
{
const { assets, component} = this.props
// throw error below
const content = component ? ReactDOM.renderToString(component) : ''
}Do you have any clue?
Thanks
Metadata
Metadata
Assignees
Labels
No labels