docs: refactor section headers (#1342)

Timeless0911 · web-flow · commit bc07f4d1c247 · 2025-11-18T12:59:09.000+08:00
diff --git a/website/docs/en/blog/index.mdx b/website/docs/en/blog/index.mdx
@@ -1,7 +1,6 @@
 ---
 title: Overview
 sidebar: false
-pageType: doc-wide
 ---
 
 # Rslib blogs
diff --git a/website/docs/en/blog/introducing-rslib.mdx b/website/docs/en/blog/introducing-rslib.mdx
@@ -1,7 +1,6 @@
 ---
 date: 2025-05-14 10:00:00
 sidebar: false
-pageType: doc-wide
 ---
 
 _May 14, 2025_
diff --git a/website/docs/en/config/_meta.json b/website/docs/en/config/_meta.json
@@ -1,17 +1,17 @@
 [
   {
-    "type": "file",
-    "name": "index",
-    "label": "Config Overview"
+    "type": "section-header",
+    "label": "Overview"
   },
+  "index",
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "lib",
-    "label": "Lib Configurations"
+    "label": "Lib configurations"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "rsbuild",
-    "label": "Rsbuild Configurations"
+    "label": "Rsbuild configurations"
   }
 ]
diff --git a/website/docs/en/config/index.mdx b/website/docs/en/config/index.mdx
@@ -1,6 +1,12 @@
 ---
-overview: true
-title: Config Overview
+pageType: doc-wide
+outline: false
 ---
 
+# Config overview
+
 This page lists all the configurations for Rslib. See [Configure Rslib](/guide/basic/configure-rslib) for detail.
+
+import Overview from '@components/Overview';
+
+<Overview />
diff --git a/website/docs/en/config/lib/_meta.json b/website/docs/en/config/lib/_meta.json
@@ -1,17 +1,18 @@
 [
-  "format",
-  "bundle",
+  "index",
   "auto-extension",
   "auto-external",
-  "redirect",
-  "syntax",
-  "external-helpers",
   "banner",
-  "footer",
+  "bundle",
   "dts",
-  "shims",
+  "experiments",
+  "external-helpers",
+  "footer",
+  "format",
   "id",
-  "umd-name",
   "out-base",
-  "experiments"
+  "redirect",
+  "shims",
+  "syntax",
+  "umd-name"
 ]
diff --git a/website/docs/en/config/lib/index.mdx b/website/docs/en/config/lib/index.mdx
@@ -1,20 +1,23 @@
-# Lib configurations
+# Overview
 
 - **Type:**
 
 ```ts
 interface LibConfig extends EnvironmentConfig {
-  format?: Format;
-  bundle?: boolean;
   autoExtension?: boolean;
   autoExternal?: AutoExternal;
-  redirect?: Redirect;
-  syntax?: Syntax;
-  externalHelpers?: boolean;
   banner?: BannerAndFooter;
+  bundle?: boolean;
+  dts?: Dts;
+  experiments?: { advancedEsm?: boolean };
+  externalHelpers?: boolean;
   footer?: BannerAndFooter;
+  format?: Format;
+  id?: string;
+  outBase?: string;
+  redirect?: Redirect;
   shims?: Shims;
-  dts?: Dts;
+  syntax?: Syntax;
   umdName?: Rspack.LibraryName;
 }
 
diff --git a/website/docs/en/config/rsbuild/_meta.json b/website/docs/en/config/rsbuild/_meta.json
@@ -1,4 +1,5 @@
 [
+  "index",
   {
     "type": "file",
     "name": "log-level",
diff --git a/website/docs/en/config/rsbuild/index.mdx b/website/docs/en/config/rsbuild/index.mdx
@@ -1,19 +1,17 @@
 import { RsbuildDocBadge } from '@components/RsbuildDocBadge';
 
-# Rsbuild configurations
+# Overview
 
 Rslib inherits its configuration from Rsbuild, so you can also configure the <RsbuildDocBadge path="/config" text="config" /> options from Rsbuild. This chapter introduces some common configuration items and explains how to use them in Rslib.
 
-:::tip
-To learn more about Rslib configurations, check out [Configure Rslib](/guide/basic/configure-rslib).
-:::
-
-## Overview
-
 - [logLevel](/config/rsbuild/log-level): Specify the log level.
 - [resolve](/config/rsbuild/resolve): Options for module resolution.
 - [source](/config/rsbuild/source): Options for input source code.
 - [output](/config/rsbuild/output): Options for build outputs.
 - [tools](/config/rsbuild/tools): Options for low-level tools.
 - [performance](/config/rsbuild/performance): Options for performance.
 - [plugins](/config/rsbuild/plugins): Configure Rsbuild plugins.
+
+:::tip
+To learn more about Rslib configurations, check out [Configure Rslib](/guide/basic/configure-rslib).
+:::
diff --git a/website/docs/en/guide/_meta.json b/website/docs/en/guide/_meta.json
@@ -1,31 +1,31 @@
 [
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "start",
-    "label": "Getting Started"
+    "label": "Start"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "solution",
     "label": "Solution"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "basic",
     "label": "Basic"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "advanced",
     "label": "Advanced"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "migration",
     "label": "Migration"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "faq",
     "label": "FAQ"
   }
diff --git a/website/docs/en/guide/solution/_meta.json b/website/docs/en/guide/solution/_meta.json
@@ -1 +1 @@
-["nodejs", "react", "vue"]
+["index", "nodejs", "react", "vue"]
diff --git a/website/docs/en/guide/solution/index.mdx b/website/docs/en/guide/solution/index.mdx
@@ -1,4 +1,4 @@
-# Solution
+# Overview
 
 In this chapter, we will introduce how to use Rslib to development libraries for browser and Node.js. We will also cover how to create libraries for different UI frameworks.
 
diff --git a/website/docs/zh/blog/index.mdx b/website/docs/zh/blog/index.mdx
@@ -1,7 +1,6 @@
 ---
 title: 总览
 sidebar: false
-pageType: doc-wide
 ---
 
 # Rslib 博客
diff --git a/website/docs/zh/blog/introducing-rslib.mdx b/website/docs/zh/blog/introducing-rslib.mdx
@@ -1,7 +1,6 @@
 ---
 date: 2025-05-14 10:00:00
 sidebar: false
-pageType: doc-wide
 ---
 
 _2025 年 5 月 14 日_
diff --git a/website/docs/zh/config/_meta.json b/website/docs/zh/config/_meta.json
@@ -1,16 +1,16 @@
 [
   {
-    "type": "file",
-    "name": "index",
-    "label": "配置总览"
+    "type": "section-header",
+    "label": "总览"
   },
+  "index",
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "lib",
     "label": "Lib 配置"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "rsbuild",
     "label": "Rsbuild 配置"
   }
diff --git a/website/docs/zh/config/index.mdx b/website/docs/zh/config/index.mdx
@@ -1,6 +1,12 @@
 ---
-overview: true
-title: 配置总览
+pageType: doc-wide
+outline: false
 ---
 
+# 配置总览
+
 本页面列出了 Rslib 的所有配置项。详细配置请查阅 [配置 Rslib](/guide/basic/configure-rslib)。
+
+import Overview from '@components/Overview';
+
+<Overview />
diff --git a/website/docs/zh/config/lib/_meta.json b/website/docs/zh/config/lib/_meta.json
@@ -1,17 +1,18 @@
 [
-  "format",
-  "bundle",
+  "index",
   "auto-extension",
   "auto-external",
-  "redirect",
-  "syntax",
-  "external-helpers",
   "banner",
-  "footer",
+  "bundle",
   "dts",
-  "shims",
+  "experiments",
+  "external-helpers",
+  "footer",
+  "format",
   "id",
-  "umd-name",
   "out-base",
-  "experiments"
+  "redirect",
+  "shims",
+  "syntax",
+  "umd-name"
 ]
diff --git a/website/docs/zh/config/lib/index.mdx b/website/docs/zh/config/lib/index.mdx
@@ -1,20 +1,23 @@
-# Lib 配置
+# 总览
 
 - **类型:**
 
 ```ts
 interface LibConfig extends EnvironmentConfig {
-  format?: Format;
-  bundle?: boolean;
   autoExtension?: boolean;
   autoExternal?: AutoExternal;
-  redirect?: Redirect;
-  syntax?: Syntax;
-  externalHelpers?: boolean;
   banner?: BannerAndFooter;
+  bundle?: boolean;
+  dts?: Dts;
+  experiments?: { advancedEsm?: boolean };
+  externalHelpers?: boolean;
+  format?: Format;
+  id?: string;
+  outBase?: string;
   footer?: BannerAndFooter;
+  redirect?: Redirect;
   shims?: Shims;
-  dts?: Dts;
+  syntax?: Syntax;
   umdName?: Rspack.LibraryName;
 }
 
diff --git a/website/docs/zh/config/rsbuild/_meta.json b/website/docs/zh/config/rsbuild/_meta.json
@@ -1,4 +1,5 @@
 [
+  "index",
   {
     "type": "file",
     "name": "log-level",
diff --git a/website/docs/zh/config/rsbuild/index.mdx b/website/docs/zh/config/rsbuild/index.mdx
@@ -1,19 +1,17 @@
 import { RsbuildDocBadge } from '@components/RsbuildDocBadge';
 
-# Rsbuild 配置
+# 总览
 
 Rslib 继承了 Rsbuild 的配置，所以你也可以配置 <RsbuildDocBadge path="/config" text="config" /> 选项。本章节介绍了一些常见的配置项，并解释了如何在 Rslib 中使用它们。
 
-:::tip
-要了解更多关于 Rslib 的配置，请查看 [Configure Rslib](/guide/basic/configure-rslib)。
-:::
-
-## 概览
-
 - [logLevel](/config/rsbuild/log-level): 指定日志级别。
 - [resolve](/config/rsbuild/resolve): 与模块解析相关的选项。
 - [source](/config/rsbuild/source): 与输入的源代码相关的选项。
 - [output](/config/rsbuild/output): 与构建产物相关的选项。
 - [tools](/config/rsbuild/tools): 与底层工具相关的选项。
 - [performance](/config/rsbuild/performance): 与性能相关的选项。
 - [plugins](/config/rsbuild/plugins): 配置 Rsbuild 插件。
+
+:::tip
+要了解更多关于 Rslib 的配置，请查看 [Configure Rslib](/guide/basic/configure-rslib)。
+:::
diff --git a/website/docs/zh/guide/_meta.json b/website/docs/zh/guide/_meta.json
@@ -1,31 +1,31 @@
 [
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "start",
     "label": "开始"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "solution",
     "label": "解决方案"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "basic",
     "label": "基础"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "advanced",
     "label": "进阶"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "migration",
     "label": "迁移"
   },
   {
-    "type": "dir",
+    "type": "dir-section-header",
     "name": "faq",
     "label": "常见问题"
   }
diff --git a/website/docs/zh/guide/solution/_meta.json b/website/docs/zh/guide/solution/_meta.json
@@ -1 +1 @@
-["nodejs", "react", "vue"]
+["index", "nodejs", "react", "vue"]
diff --git a/website/docs/zh/guide/solution/index.mdx b/website/docs/zh/guide/solution/index.mdx
@@ -1,4 +1,4 @@
-# 解决方案
+# 总览
 
 在本章中，将介绍如何使用 Rslib 开发浏览器和 Node.js 的库。我们还将介绍如何为不同的 UI 框架创建库。
 
diff --git a/website/theme/components/Overview.module.scss b/website/theme/components/Overview.module.scss
diff --git a/website/theme/components/Overview.tsx b/website/theme/components/Overview.tsx
diff --git a/website/theme/index.scss b/website/theme/index.scss

Original file line number	Diff line number	Diff line change
`@@ -1,17 +1,17 @@`
`1`	`1`	`[`
`2`	`2`	`{`
`3`		`- "type": "file",`
`4`		`- "name": "index",`
`5`		`- "label": "Config Overview"`
	`3`	`+ "type": "section-header",`
	`4`	`+ "label": "Overview"`
`6`	`5`	`},`
	`6`	`+ "index",`
`7`	`7`	`{`
`8`		`- "type": "dir",`
	`8`	`+ "type": "dir-section-header",`
`9`	`9`	`"name": "lib",`
`10`		`- "label": "Lib Configurations"`
	`10`	`+ "label": "Lib configurations"`
`11`	`11`	`},`
`12`	`12`	`{`
`13`		`- "type": "dir",`
	`13`	`+ "type": "dir-section-header",`
`14`	`14`	`"name": "rsbuild",`
`15`		`- "label": "Rsbuild Configurations"`
	`15`	`+ "label": "Rsbuild configurations"`
`16`	`16`	`}`
`17`	`17`	`]`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`[`
	`2`	`+ "index",`
`2`	`3`	`{`
`3`	`4`	`"type": "file",`
`4`	`5`	`"name": "log-level",`
Original file line number	Diff line number	Diff line change
`@@ -1,31 +1,31 @@`
`1`	`1`	`[`
`2`	`2`	`{`
`3`		`- "type": "dir",`
	`3`	`+ "type": "dir-section-header",`
`4`	`4`	`"name": "start",`
`5`		`- "label": "Getting Started"`
	`5`	`+ "label": "Start"`
`6`	`6`	`},`
`7`	`7`	`{`
`8`		`- "type": "dir",`
	`8`	`+ "type": "dir-section-header",`
`9`	`9`	`"name": "solution",`
`10`	`10`	`"label": "Solution"`
`11`	`11`	`},`
`12`	`12`	`{`
`13`		`- "type": "dir",`
	`13`	`+ "type": "dir-section-header",`
`14`	`14`	`"name": "basic",`
`15`	`15`	`"label": "Basic"`
`16`	`16`	`},`
`17`	`17`	`{`
`18`		`- "type": "dir",`
	`18`	`+ "type": "dir-section-header",`
`19`	`19`	`"name": "advanced",`
`20`	`20`	`"label": "Advanced"`
`21`	`21`	`},`
`22`	`22`	`{`
`23`		`- "type": "dir",`
	`23`	`+ "type": "dir-section-header",`
`24`	`24`	`"name": "migration",`
`25`	`25`	`"label": "Migration"`
`26`	`26`	`},`
`27`	`27`	`{`
`28`		`- "type": "dir",`
	`28`	`+ "type": "dir-section-header",`
`29`	`29`	`"name": "faq",`
`30`	`30`	`"label": "FAQ"`
`31`	`31`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-["nodejs", "react", "vue"]`
	`1`	`+["index", "nodejs", "react", "vue"]`