mirror of
https://github.com/terribleplan/next.js.git
synced 2024-01-19 02:48:18 +00:00
46 lines
1.2 KiB
JavaScript
46 lines
1.2 KiB
JavaScript
|
import Document, { Head, Main, NextScript } from 'next/document'
|
||
|
import Helmet from 'react-helmet'
|
||
|
|
||
|
export default class extends Document {
|
||
|
static async getInitialProps ({ renderPage }) {
|
||
|
// see https://github.com/nfl/react-helmet#server-usage for more information
|
||
|
// 'head' was occupied by 'renderPage().head', we cannot use it
|
||
|
return { ...renderPage(), helmet: Helmet.rewind() }
|
||
|
}
|
||
|
|
||
|
// should render on <html>
|
||
|
get helmetHtmlAttrComponents () {
|
||
|
return this.props.helmet.htmlAttributes.toComponent()
|
||
|
}
|
||
|
|
||
|
// should render on <head>
|
||
|
get helmetHeadComponents () {
|
||
|
return Object.keys(this.props.helmet)
|
||
|
.filter(el => el !== 'htmlAttributes') // remove htmlAttributes which is not for <head> but for <html>
|
||
|
.map(el => this.props.helmet[el].toComponent())
|
||
|
}
|
||
|
|
||
|
get helmetJsx () {
|
||
|
return (<Helmet
|
||
|
htmlAttributes={{lang: 'en'}}
|
||
|
title='Hello next.js!'
|
||
|
meta={[
|
||
|
{ name: 'viewport', content: 'width=device-width, initial-scale=1' }
|
||
|
]}
|
||
|
/>)
|
||
|
}
|
||
|
|
||
|
render () {
|
||
|
return (<html {...this.helmetHtmlAttrComponents}>
|
||
|
<Head>
|
||
|
{ this.helmetJsx }
|
||
|
{ this.helmetHeadComponents }
|
||
|
</Head>
|
||
|
<body>
|
||
|
<Main />
|
||
|
<NextScript />
|
||
|
</body>
|
||
|
</html>)
|
||
|
}
|
||
|
}
|