From a404665f58317e4c5ef27e052c758e1157077243 Mon Sep 17 00:00:00 2001 From: Henrik Wenz Date: Wed, 7 Sep 2022 13:53:43 +0200 Subject: [PATCH 1/3] Remove babel --- examples/with-react-jss/.babelrc | 3 --- 1 file changed, 3 deletions(-) delete mode 100644 examples/with-react-jss/.babelrc diff --git a/examples/with-react-jss/.babelrc b/examples/with-react-jss/.babelrc deleted file mode 100644 index 1ff94f7ed28e..000000000000 --- a/examples/with-react-jss/.babelrc +++ /dev/null @@ -1,3 +0,0 @@ -{ - "presets": ["next/babel"] -} From 2b94bccbf6d7ed85a8415020e139ef4b45aaff02 Mon Sep 17 00:00:00 2001 From: Henrik Wenz Date: Wed, 7 Sep 2022 13:54:25 +0200 Subject: [PATCH 2/3] Update deps --- examples/with-react-jss/package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/examples/with-react-jss/package.json b/examples/with-react-jss/package.json index 17ac6c57e840..8cd21c718e58 100644 --- a/examples/with-react-jss/package.json +++ b/examples/with-react-jss/package.json @@ -7,8 +7,8 @@ }, "dependencies": { "next": "latest", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "react-jss": "^10.3.0" + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-jss": "^10.9.2" } } From b2c7a5274f2687ee61ee32c2c44e48d5a3de1493 Mon Sep 17 00:00:00 2001 From: Henrik Wenz Date: Wed, 7 Sep 2022 14:05:52 +0200 Subject: [PATCH 3/3] [Docs] Migrate with-react-jss to typescript --- examples/with-react-jss/package.json | 5 +++++ .../pages/{_app.js => _app.tsx} | 5 +++-- .../pages/{_document.js => _document.tsx} | 4 ++-- .../pages/{index.js => index.tsx} | 4 +--- examples/with-react-jss/tsconfig.json | 20 +++++++++++++++++++ 5 files changed, 31 insertions(+), 7 deletions(-) rename examples/with-react-jss/pages/{_app.js => _app.tsx} (60%) rename examples/with-react-jss/pages/{_document.js => _document.tsx} (87%) rename examples/with-react-jss/pages/{index.js => index.tsx} (90%) create mode 100644 examples/with-react-jss/tsconfig.json diff --git a/examples/with-react-jss/package.json b/examples/with-react-jss/package.json index 8cd21c718e58..2ee0fa080925 100644 --- a/examples/with-react-jss/package.json +++ b/examples/with-react-jss/package.json @@ -10,5 +10,10 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-jss": "^10.9.2" + }, + "devDependencies": { + "@types/node": "18.7.15", + "@types/react": "18.0.18", + "typescript": "4.8.2" } } diff --git a/examples/with-react-jss/pages/_app.js b/examples/with-react-jss/pages/_app.tsx similarity index 60% rename from examples/with-react-jss/pages/_app.js rename to examples/with-react-jss/pages/_app.tsx index ad98bbd6bf42..74b569b67fac 100644 --- a/examples/with-react-jss/pages/_app.js +++ b/examples/with-react-jss/pages/_app.tsx @@ -1,9 +1,10 @@ +import type { AppProps } from 'next/app' import { useEffect } from 'react' -export default function App({ Component, pageProps }) { +export default function App({ Component, pageProps }: AppProps) { useEffect(() => { const style = document.getElementById('server-side-styles') - if (style) { + if (style && style.parentNode) { style.parentNode.removeChild(style) } }, []) diff --git a/examples/with-react-jss/pages/_document.js b/examples/with-react-jss/pages/_document.tsx similarity index 87% rename from examples/with-react-jss/pages/_document.js rename to examples/with-react-jss/pages/_document.tsx index 53ad6b117efe..a20015c58ad7 100644 --- a/examples/with-react-jss/pages/_document.js +++ b/examples/with-react-jss/pages/_document.tsx @@ -1,8 +1,8 @@ -import Document from 'next/document' +import Document, { DocumentContext } from 'next/document' import { SheetsRegistry, JssProvider, createGenerateId } from 'react-jss' export default class JssDocument extends Document { - static async getInitialProps(ctx) { + static async getInitialProps(ctx: DocumentContext) { const registry = new SheetsRegistry() const generateId = createGenerateId() const originalRenderPage = ctx.renderPage diff --git a/examples/with-react-jss/pages/index.js b/examples/with-react-jss/pages/index.tsx similarity index 90% rename from examples/with-react-jss/pages/index.js rename to examples/with-react-jss/pages/index.tsx index f8bafce6daad..1726845c1f76 100644 --- a/examples/with-react-jss/pages/index.js +++ b/examples/with-react-jss/pages/index.tsx @@ -12,7 +12,7 @@ const useStyles = createUseStyles({ }, }) -function Index() { +export default function IndexPage() { const classes = useStyles() return ( @@ -23,5 +23,3 @@ function Index() { ) } - -export default Index diff --git a/examples/with-react-jss/tsconfig.json b/examples/with-react-jss/tsconfig.json new file mode 100644 index 000000000000..ccaea0672d6e --- /dev/null +++ b/examples/with-react-jss/tsconfig.json @@ -0,0 +1,20 @@ +{ + "compilerOptions": { + "target": "es5", + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "incremental": true, + "esModuleInterop": true, + "moduleResolution": "node", + "module": "esnext", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve" + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], + "exclude": ["node_modules"] +}