1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/examples/with-emotion/pages/_document.js
Hugo Meissner 573692c137 emotion v8 + adjustments for breaking changes (#3054)
* emotion v8 + adjustments for breaking changes

* Corrected versioning

* Take hydrate from 'react-emotion'

I was actually wondering that, but haven't seen hydrate in the medium post (even though you pointed out that react-emotion exports all of emotion and I've seen it in source) and didn't want to risk it for the off chance that it *should* be imported directly from emotion for some reason :D
2017-10-09 23:18:37 +02:00

34 lines
746 B
JavaScript

import Document, { Head, Main, NextScript } from 'next/document'
import { extractCritical } from 'emotion-server'
export default class MyDocument extends Document {
static getInitialProps ({ renderPage }) {
const page = renderPage()
const styles = extractCritical(page.html)
return { ...page, ...styles }
}
constructor (props) {
super(props)
const { __NEXT_DATA__, ids } = props
if (ids) {
__NEXT_DATA__.ids = ids
}
}
render () {
return (
<html>
<Head>
<title>With Emotion</title>
<style dangerouslySetInnerHTML={{ __html: this.props.css }} />
</Head>
<body>
<Main />
<NextScript />
</body>
</html>
)
}
}