terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity

[examples] Update react jss example (#6198)

Browse source 
This updates the react-jss example to work with the v10 alpha
This commit is contained in:
Henri 2019-02-04 11:51:38 +01:00 committed by Tim Neutkens
parent 815f2e9138
commit 98cf0a8311
3 changed files with 7 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
examples/with-react-jss/package.json
View file

@ -7,10 +7,10 @@
"start": "next start" "start": "next start"
}, },
"dependencies": { "dependencies": {
"next": "latest", "next": "canary",
"react": "^16.7.0", "react": "^16.7.0",
"react-dom": "^16.7.0", "react-dom": "^16.7.0",
"react-jss": "8.6.1" "react-jss": "10.0.0-alpha.9"
}, },
"license": "ISC" "license": "ISC"
} }

5
examples/with-react-jss/pages/_document.js
View file

@ -1,15 +1,16 @@
import React from 'react' import React from 'react'
import Document, { Head, Main, NextScript } from 'next/document' import Document, { Head, Main, NextScript } from 'next/document'
import { SheetsRegistry, JssProvider } from 'react-jss' import { SheetsRegistry, JssProvider, createGenerateId } from 'react-jss'
export default class JssDocument extends Document { export default class JssDocument extends Document {
static async getInitialProps (ctx) { static async getInitialProps (ctx) {
const registry = new SheetsRegistry() const registry = new SheetsRegistry()
const generateId = createGenerateId()
const originalRenderPage = ctx.renderPage const originalRenderPage = ctx.renderPage
ctx.renderPage = () => ctx.renderPage = () =>
originalRenderPage({ originalRenderPage({
enhanceApp: App => props => ( enhanceApp: App => props => (
<JssProvider registry={registry}> <JssProvider registry={registry} generateId={generateId}>
<App {...props} /> <App {...props} />
</JssProvider> </JssProvider>
) )

4
examples/with-react-jss/pages/index.js
View file

@ -1,5 +1,5 @@
import React from 'react' import React from 'react'
import injectSheet from 'react-jss' import withStyles from 'react-jss'
const styles = { const styles = {
container: { container: {
@ -23,4 +23,4 @@ function Index (props) {
) )
} }
export default injectSheet(styles)(Index) export default withStyles(styles)(Index)