feat: add asyncMode env

Author: xiaoyu2er

apps/docs/.env.example

@@ -1,3 +1,5 @@
+# https://fumadocs.dev/docs/mdx/async
+MDX_ASYNC=
 EN_DOMAIN=nextjs.im
 ZH_HANS_DOMAIN=zh-hans.nextjs.im
 ORAMA_PRIVATE_API_KEY_EN=

apps/docs/source.config.ts

@@ -9,9 +9,17 @@ import { z } from 'zod';
 import { addMdxContent } from '@/lib/remark-plugins/remark-add-content';
 import { convertCodeMeta } from '@/lib/remark-plugins/remark-convert-code-meta';
 
+const asyncMode = process.env.MDX_ASYNC === 'true';
+if (!asyncMode && process.env.NODE_ENV === 'development') {
+  console.log('AsyncMode', asyncMode);
+  console.warn(
+    'This may result in longer dev server start time for large docs sites, you can enable Async Mode on doc collections to improve this.',
+  );
+}
+
 const defaultDocsOptions = {
   docs: {
-    async: true,
+    async: asyncMode,
     schema: frontmatterSchema.extend({
       nav_title: z.string().optional(),
       source: z.string().optional(),
@@ -43,7 +51,6 @@ export const docs_zh_hans = defineDocs({
 
 export default defineConfig({
   mdxOptions: {
-    remarkStructureOptions: false,
     remarkPlugins: (v) => [convertCodeMeta, addMdxContent, ...v],
   },
 });

apps/docs/src/app/[locale]/docs/[[...slug]]/page.tsx

@@ -1,4 +1,5 @@
 import { DocsLayout } from '@/components/layout';
+import { routing } from '@/i18n/routing';
 import { type RouterType, routerTypeCookie } from '@/lib/const';
 import { getPage } from '@/lib/page';
 import { getDocsLayoutTree, getPageTreePeers } from '@/lib/pageTree';
@@ -15,7 +16,7 @@ import { cookies } from 'next/headers';
 import { notFound } from 'next/navigation';
 
 export default async function Docs(props: {
-  params: Promise<{ locale: Locale; slug?: string[] }>;
+  params: Promise<{ locale: Locale; slug: string[] }>;
 }) {
   const routerType = (await cookies()).get(routerTypeCookie)
     ?.value as RouterType;
@@ -28,16 +29,23 @@ export default async function Docs(props: {
   const page = getPage(locale, docUrl);
   if (!page) notFound();
   const { isApp, isPages } = parseDocId(docId);
-  // Markdown content requires await
-  let { body: MdxContent, toc } = await page.data.load();
+  // @ts-ignore
+  let { body: MdxContent, toc } = page.data.load
+    ? // @ts-ignore
+      await page.data.load()
+    : page.data;
 
   // source: app/getting-started/installation
   const ref = page.data.source;
   if (ref) {
     const refUrl = getDocUrl(ref);
     const refPage = getPage(locale, refUrl);
     if (!refPage) notFound();
-    const { body: MdxContent2, toc: toc2 } = await refPage.data.load();
+    // @ts-ignore
+    const { body: MdxContent2, toc: toc2 } = refPage.data.load
+      ? // @ts-ignore
+        await refPage.data.load()
+      : refPage.data;
 
     MdxContent = MdxContent2;
     toc = toc2;

apps/docs/src/lib/remark-plugins/remark-add-content.ts

@@ -1,4 +1,4 @@
-import type { Code, Heading, Paragraph, Root } from 'mdast';
+import type { Heading, Paragraph, Root } from 'mdast';
 
 /**
  * Remark plugin that adds content to the document based on frontmatter data