diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index cf580a2..0000000 Binary files a/.DS_Store and /dev/null differ diff --git a/packages/client/next.config.js b/packages/client/next.config.js new file mode 100644 index 0000000..0246618 --- /dev/null +++ b/packages/client/next.config.js @@ -0,0 +1,10 @@ +/** @type {import('next').NextConfig} */ + +const nextConfig = { + compiler: { + styledComponents: true, + }, + reactStrictMode: true, +}; + +export default nextConfig; diff --git a/packages/client/package.json b/packages/client/package.json index 6b7dd39..c3a65da 100644 --- a/packages/client/package.json +++ b/packages/client/package.json @@ -21,7 +21,7 @@ "react-chartjs-2": "^5.2.0", "react-dom": "^18.2.0", "react-google-charts": "^4.0.0", - "styled-components": "^5.3.9", + "styled-components": "^6.0.2", "zustand": "^4.3.7" }, "devDependencies": { diff --git a/packages/client/pages/_document.tsx b/packages/client/pages/_document.tsx new file mode 100644 index 0000000..602ee61 --- /dev/null +++ b/packages/client/pages/_document.tsx @@ -0,0 +1,25 @@ +import React from 'react'; +import Document, { type DocumentContext } from 'next/document'; +import { ServerStyleSheet } from 'styled-components'; + +export default class MyDocument extends Document { + static async getInitialProps(ctx: DocumentContext): Promise { + const sheet = new ServerStyleSheet(); + const originalRenderPage = ctx.renderPage; + + try { + ctx.renderPage = async () => + await originalRenderPage({ + enhanceApp: (App) => (props) => sheet.collectStyles(), + }); + + const initialProps = await Document.getInitialProps(ctx); + return { + ...initialProps, + styles: [initialProps.styles, sheet.getStyleElement()], + }; + } finally { + sheet.seal(); + } + } +} diff --git a/packages/client/tsconfig.json b/packages/client/tsconfig.json index 803bb3e..01c1a48 100644 --- a/packages/client/tsconfig.json +++ b/packages/client/tsconfig.json @@ -1,12 +1,18 @@ { "extends": "../../tsconfig.json", - "files": ["../server/app.ts"], + "files": [ + "../server/app.ts" + ], "compilerOptions": { "rootDir": "../", "composite": true, "target": "ESNext", "useDefineForClassFields": true, - "lib": ["DOM", "DOM.Iterable", "ESNext"], + "lib": [ + "DOM", + "DOM.Iterable", + "ESNext" + ], "allowJs": false, "skipLibCheck": true, "allowSyntheticDefaultImports": true, @@ -21,14 +27,32 @@ "incremental": true, "baseUrl": ".", "paths": { - "@/*": ["./*"] - } + "@/*": [ + "./*" + ] + }, + "plugins": [ + { + "name": "next" + } + ] }, - "include": ["next-env.d.ts", "pages", "components", "screens", "lib", "./*"], + "include": [ + "next-env.d.ts", + "pages", + "components", + "screens", + "lib", + "./*", + ".next/types/**/*.ts" + ], "references": [ { "path": "./tsconfig.node.json" } ], - "exclude": ["node_modules", "../server/app.ts"] + "exclude": [ + "node_modules", + "../server/app.ts" + ] }