a57fa7ebb1
* upload example * fix * fix * fix * fix .babelrc * fix standard style * fix indent * rename helmetHead to helmet * added gitignore * package.json * removed yarn.lock * Added more examples of using react-helmet * removed gitignore
45 lines
1.2 KiB
JavaScript
45 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>)
|
|
}
|
|
}
|