fix: sidebar data undefined in production

sanyuan0704 · Sep 24, 2022 · 86f63ca · 86f63ca
1 parent db5b88e
commit 86f63ca
Show file tree

Hide file tree

Showing 7 changed files with 30 additions and 10 deletions.
diff --git a/docs/.island/config.ts b/docs/.island/config.ts
@@ -29,14 +29,14 @@ export default defineConfig({
       },
       {
         text: 'API',
-        link: '/api',
+        link: '/api/',
         activeMatch: '^/api'
       }
     ],
 
     sidebar: {
       '/': getTutorialSidebar(),
-      '/api': getApiSidebar()
+      '/api/': getApiSidebar()
     },
 
     footer: {

diff --git a/docs/guide/configure-site.md b/docs/guide/configure-site.md
@@ -125,5 +125,5 @@ type SidebarItem = {
 The `object` config is a map for `SidebarGroup`, which has following type:
 
 ```ts
-Record<string, SidebarGroup>;
+Record<string, SidebarGroup[]>;
 ```
diff --git a/src/node/build.ts b/src/node/build.ts
@@ -293,8 +293,17 @@ class SSGBuilder {
       }
     </body>
   </html>`.trim();
-    const fileName =
-      routePath === '/' ? 'index.html' : `${routePath.slice(1)}.html`;
+
+    const normalizeHtmlFilePath = (path: string) => {
+      if (path === '/') {
+        return 'index.html';
+      }
+      if (path.endsWith('/')) {
+        return `${path}index.html`;
+      }
+      return `${path}.html`;
+    };
+    const fileName = normalizeHtmlFilePath(routePath);
     await fs.ensureDir(join(this.#root, DIST_PATH, dirname(fileName)));
     await fs.writeFile(join(this.#root, DIST_PATH, fileName), html);
   }

diff --git a/src/theme-default/components/Siderbar/index.tsx b/src/theme-default/components/Siderbar/index.tsx
@@ -12,7 +12,6 @@ export function SideBar() {
 
   const sidebar = siteData?.themeConfig?.sidebar || [];
   const sidebarData = useSidebarData(sidebar, location.pathname);
-  console.log(sidebarData);
 
   const renderGroupItem = (item: DefaultTheme.SidebarItem, depth = 0) => {
     const marginLeft = `${depth * 20}px`;

diff --git a/src/theme-default/layout/APILayout/index.tsx b/src/theme-default/layout/APILayout/index.tsx
@@ -1,6 +1,7 @@
 import { usePageData } from 'island/client';
 import { useEffect, useState } from 'react';
 import { Header } from 'shared/types';
+import { normalizeHref } from '../../logic';
 import { Link } from '../../components/Link/index';
 import styles from './index.module.scss';
 
@@ -59,7 +60,7 @@ export function APILayout() {
                       styles[`level${header.depth}`]
                     }`}
                   >
-                    <Link href={`${item.link}#${header.id}`}>
+                    <Link href={`${normalizeHref(item.link)}#${header.id}`}>
                       {header.text}
                     </Link>
                   </li>

diff --git a/src/theme-default/logic/index.ts b/src/theme-default/logic/index.ts
@@ -11,7 +11,14 @@ export function normalizeHref(url?: string) {
   if (!isProduction() || url.startsWith('http')) {
     return url;
   }
-  const suffix = import.meta.env.ENABLE_SPA ? '' : '.html';
+
+  let suffix = '';
+  if (!import.meta.env.ENABLE_SPA) {
+    suffix += '.html';
+    if (url.endsWith('/')) {
+      suffix = 'index' + suffix;
+    }
+  }
   return addLeadingSlash(`${url}${suffix}`);
 }
 

diff --git a/src/theme-default/logic/useSidebarData.ts b/src/theme-default/logic/useSidebarData.ts
@@ -6,12 +6,16 @@ export function useSidebarData(
 ): DefaultTheme.SidebarGroup | DefaultTheme.SidebarGroup[] | undefined {
   if (Array.isArray(siderbar)) {
     return siderbar.find((group) =>
-      group.items.some((item) => normalizeHref(item.link) === currentPathname)
+      group.items.some(
+        (item) => normalizeHref(item.link) === normalizeHref(currentPathname)
+      )
     );
   } else {
     for (const name of Object.keys(siderbar)) {
       const result = siderbar[name].find((group) =>
-        group.items.some((item) => normalizeHref(item.link) === currentPathname)
+        group.items.some(
+          (item) => normalizeHref(item.link) === normalizeHref(currentPathname)
+        )
       );
       if (result) {
         return siderbar[name];