diff --git a/web/pages/_document.tsx b/web/pages/_document.tsx
index c04398370..e7e504556 100644
--- a/web/pages/_document.tsx
+++ b/web/pages/_document.tsx
@@ -1,7 +1,9 @@
/* eslint-disable react/no-danger */
import { readFileSync } from 'fs';
import { join } from 'path';
-import { Html, Head, Main, NextScript } from 'next/document';
+import Document, { Html, Head, Main, NextScript } from 'next/document';
+import type { DocumentContext } from 'next/document';
+import { createCache, extractStyle, StyleProvider } from '@ant-design/cssinjs';
class InlineStylesHead extends Head {
getCssLinks: Head['getCssLinks'] = ({ allFiles }) => {
@@ -22,14 +24,46 @@ class InlineStylesHead extends Head {
};
}
-export default function Document() {
- return (
-
-
-
-
-
-
-
- );
-}
+const Doc = () => (
+
+
+
+
+
+
+
+);
+
+
+/*
+
+Yoinked from https://ant.design/docs/react/use-with-next#using-pages-router. Change if someone figures out a way to
+mesh this with the InlineStyles above.
+
+*/
+Doc.getInitialProps = async (ctx: DocumentContext) => {
+ const cache = createCache();
+ const originalRenderPage = ctx.renderPage;
+ ctx.renderPage = () =>
+ originalRenderPage({
+ enhanceApp: App => props => (
+
+
+
+ ),
+ });
+
+ const initialProps = await Document.getInitialProps(ctx);
+ const style = extractStyle(cache, true);
+ return {
+ ...initialProps,
+ styles: (
+ <>
+ {initialProps.styles}
+
+
+ ),
+ };
+};
+
+export default Doc;