From df7ee3c5abfdfbbeb683ef5948c3a70edd92664e Mon Sep 17 00:00:00 2001
From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com>
Date: Sat, 30 Dec 2023 16:09:46 +0530
Subject: [PATCH] specify top-level await too

---
 docs/reference/site-config.md | 51 ++++++++++++++++++++++++++++-------
 1 file changed, 42 insertions(+), 9 deletions(-)

diff --git a/docs/reference/site-config.md b/docs/reference/site-config.md
index b7d34fa1..1cf9d726 100644
--- a/docs/reference/site-config.md
+++ b/docs/reference/site-config.md
@@ -24,29 +24,62 @@ export default {
 }
 ```
 
-In case of dynamic config, you can also default export a function:
+:::details Dynamic (Async) Config
 
-```js
-export default async () => {
+If you need to dynamically generate the config, you can also default export a function. For example:
+
+```ts
+import { defineConfig } from 'vitepress'
+
+export default async () => defineConfig({
   const posts = await (await fetch('https://my-cms.com/blog-posts')).json()
 
   return {
+    // app level config options
     lang: 'en-US',
     title: 'VitePress',
     description: 'Vite & Vue powered static site generator.',
-    // theme config options
-    themeConfig: { 
+
+    // theme level config options
+    themeConfig: {
       sidebar: [
-        ...posts.map(post => ({
-          text: post.name, 
+        ...posts.map((post) => ({
+          text: post.name,
           link: `/posts/${post.name}`
         }))
       ]
     }
-  };
-}
+  }
+})
+```
+
+You can also use top-level `await`. For example:
+
+```ts
+import { defineConfig } from 'vitepress'
+
+const posts = await (await fetch('https://my-cms.com/blog-posts')).json()
+
+export default defineConfig({
+  // app level config options
+  lang: 'en-US',
+  title: 'VitePress',
+  description: 'Vite & Vue powered static site generator.',
+
+  // theme level config options
+  themeConfig: {
+    sidebar: [
+      ...posts.map((post) => ({
+        text: post.name,
+        link: `/posts/${post.name}`
+      }))
+    ]
+  }
+})
 ```
 
+:::
+
 ### Config Intellisense
 
 Using the `defineConfig` helper will provide TypeScript-powered intellisense for config options. Assuming your IDE supports it, this should work in both JavaScript and TypeScript.