document: add initialProps for styled-components

2022-04-24 20:57:30 +03:00 · 2022-04-24 20:57:30 +03:00 · 6c8f50223c
commit 6c8f50223c
parent e1e944da30
1 changed files with 25 additions and 0 deletions
--- a/pages/_document.jsx
+++ b/pages/_document.jsx
@ -1,6 +1,31 @@
 import Document, { Head, Html, Main, NextScript } from 'next/document';
+import { ServerStyleSheet } from 'styled-components';

 export default class MyDocument extends Document {
+  static async getInitialProps(ctx) {
+    const sheet = new ServerStyleSheet();
+    const originalRenderPage = ctx.renderPage;
+
+    try {
+      ctx.renderPage = () =>
+        originalRenderPage({
+          enhanceApp: App => props => sheet.collectStyles(<App {...props} />),
+        });
+
+      const initialProps = await Document.getInitialProps(ctx);
+      return {
+        ...initialProps,
+        styles: (
+          <>
+            {initialProps.styles}
+            {sheet.getStyleElement()}
+          </>
+        ),
+      };
+    } finally {
+      sheet.seal();
+    }
+  }
  render() {
    return (
      <Html lang="ru" translate="no">