Skip to content

Instantly share code, notes, and snippets.

@stramel

stramel/_app.js

Created May 16, 2018 23:18
Show Gist options
  • Save stramel/67b76f1c13445709b112f0902a4042d3 to your computer and use it in GitHub Desktop.
Save stramel/67b76f1c13445709b112f0902a4042d3 to your computer and use it in GitHub Desktop.
Download ZIP
Page overrides
Raw
_app.js
import App, { Container } from 'next/app'
import React from 'react'
class MyApp extends App {
render() {
const {
Component, pageProps
} = this.props
return (
<Container>
<Component {...pageProps} />
</Container>
)
}
}
export default MyApp
Raw
_document.js
import React from 'react'
import Document, { Head, Main, NextScript } from 'next/document'
import 'styles/index.css'
import hoistNonReactStatics from 'hoist-non-react-statics'
import { ServerStyleSheet } from 'styled-components'
const hoistStatics = higherOrderComponent => BaseComponent => {
const NewComponent = higherOrderComponent(BaseComponent)
hoistNonReactStatics(NewComponent, BaseComponent)
return NewComponent
}
export default class MyDocument extends Document {
static getInitialProps({ renderPage }) {
const sheet = new ServerStyleSheet()
const enhancer = hoistStatics(App => props => sheet.collectStyles(<App {...props} />))
const page = renderPage(enhancer)
const styleTags = sheet.getStyleElement()
return { ...page, styleTags }
}
render() {
return (
<html lang='en-US'>
<Head>
<meta charSet='utf-8' />
<meta
name='viewport'
content='width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes'
/>
<link rel='stylesheet' href='/_next/static/style.css' />
{this.props.styleTags}
</Head>
<body>
<Main />
<NextScript />
</body>
</html>
)
}
}
Raw
index.js
export { default } from './home'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment