create-react-docs-ui 0.6.9 → 0.6.10

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "create-react-docs-ui",
-    "version": "0.6.9",
+    "version": "0.6.10",
     "private": false,
     "type": "module",
     "bin": {

package/template/package.json

@@ -15,7 +15,7 @@
         "gray-matter": "^4.0.3",
         "js-yaml": "^4.1.0",
         "react": "^19.0.0",
-        "react-docs-ui": "^0.6.9",
+        "react-docs-ui": "^0.6.10",
         "react-dom": "^19.0.0",
         "react-router-dom": "^7.8.0"
     },

package/template/vite.config.ts

@@ -1,276 +1,305 @@
 // @ts-nocheck
-import path from "path"
-import fs from "node:fs/promises"
-import { spawn } from "child_process"
-import react from "@vitejs/plugin-react"
-import { defineConfig } from "vite"
-import yaml from "js-yaml"
-import { mdxComponentsPlugin } from "./vite-plugin-mdx-components"
+import path from "path";
+import fs from "node:fs/promises";
+import { spawn } from "child_process";
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
+import yaml from "js-yaml";
+import { mdxComponentsPlugin } from "./vite-plugin-mdx-components";
 
-const FONT_BASE_URL = "https://file.shenjianl.cn/fonts/"
+const FONT_BASE_URL = "https://file.shenjianl.cn/fonts/";
 
 function fontDownloadPlugin() {
-  let checkedInServe = false
-
-  const log = (message) => {
-    console.log(`[font-download] ${message}`)
-  }
-
-  const formatBytes = (bytes) => {
-    if (!Number.isFinite(bytes) || bytes <= 0) return "0 B"
-
-    const units = ["B", "KB", "MB", "GB"]
-    let value = bytes
-    let unitIndex = 0
-
-    while (value >= 1024 && unitIndex < units.length - 1) {
-      value /= 1024
-      unitIndex += 1
-    }
-
-    return `${value.toFixed(value >= 100 || unitIndex === 0 ? 0 : 1)} ${units[unitIndex]}`
-  }
-
-  const downloadFont = async (task) => {
-    const response = await fetch(task.source)
-    if (!response.ok) {
-      throw new Error(`HTTP ${response.status}`)
-    }
-
-    if (!response.body) {
-      throw new Error("response body is empty")
-    }
-
-    const totalBytes = Number(response.headers.get("content-length") || 0)
-    const reader = response.body.getReader()
-    const chunks = []
-    const startedAt = Date.now()
-    let downloadedBytes = 0
-    let lastLogAt = 0
-
-    log(`start: ${task.filename} <- ${task.source}`)
-
-    while (true) {
-      const { done, value } = await reader.read()
-      if (done) break
-
-      const chunk = Buffer.from(value)
-      chunks.push(chunk)
-      downloadedBytes += chunk.byteLength
-
-      const now = Date.now()
-      if (lastLogAt === 0 || now - lastLogAt >= 500 || (totalBytes > 0 && downloadedBytes >= totalBytes)) {
-        const elapsedSeconds = Math.max((now - startedAt) / 1000, 0.001)
-        const speed = downloadedBytes / elapsedSeconds
-        const progress = totalBytes > 0 ? `${((downloadedBytes / totalBytes) * 100).toFixed(1)}%` : "unknown"
-        const totalText = totalBytes > 0 ? formatBytes(totalBytes) : "unknown"
-
-        log(
-          `progress: ${task.filename} ${formatBytes(downloadedBytes)}/${totalText} (${progress}) @ ${formatBytes(speed)}/s`
-        )
-        lastLogAt = now
-      }
-    }
-
-    return Buffer.concat(chunks)
-  }
-
-  const ensureFonts = async () => {
-    const root = path.resolve(__dirname)
-    const configDir = path.resolve(root, "public", "config")
-    const fontsDir = path.resolve(root, "public", "fonts")
-
-    await fs.mkdir(fontsDir, { recursive: true })
-
-    const tasks = new Map()
-    for (const fileName of ["site.yaml", "site.en.yaml"]) {
-      const filePath = path.resolve(configDir, fileName)
-      try {
-        const content = await fs.readFile(filePath, "utf8")
-        const parsed = yaml.load(content) || {}
-        const entries = parsed?.fonts?.downloadFonts || []
-
-        for (const entry of entries) {
-          const normalized = String(entry || "").trim()
-          if (!normalized) continue
-
-          const url = /^https?:\/\//i.test(normalized)
-            ? new URL(normalized)
-            : new URL(normalized.replace(/^\/+/, ""), FONT_BASE_URL)
-
-          const filename = path.posix.basename(url.pathname)
-          if (filename) {
-            tasks.set(filename, { filename, source: url.toString() })
-          }
+    let checkedInServe = false;
+
+    const log = (message) => {
+        console.log(`[font-download] ${message}`);
+    };
+
+    const formatBytes = (bytes) => {
+        if (!Number.isFinite(bytes) || bytes <= 0) return "0 B";
+
+        const units = ["B", "KB", "MB", "GB"];
+        let value = bytes;
+        let unitIndex = 0;
+
+        while (value >= 1024 && unitIndex < units.length - 1) {
+            value /= 1024;
+            unitIndex += 1;
         }
-      } catch (error) {
-        if (error?.code !== "ENOENT") {
-          log(`failed to read ${fileName}: ${error.message}`)
+
+        return `${value.toFixed(value >= 100 || unitIndex === 0 ? 0 : 1)} ${units[unitIndex]}`;
+    };
+
+    const downloadFont = async (task) => {
+        const response = await fetch(task.source);
+        if (!response.ok) {
+            throw new Error(`HTTP ${response.status}`);
         }
-      }
-    }
-
-    if (tasks.size === 0) {
-      log("no fonts.downloadFonts entries found in public/config/site*.yaml")
-      return
-    }
-
-    for (const task of tasks.values()) {
-      const targetPath = path.resolve(fontsDir, task.filename)
-
-      try {
-        await fs.access(targetPath)
-        log(`exists: public/fonts/${task.filename}`)
-        continue
-      } catch {
-        // Continue to download.
-      }
-
-      try {
-        const fileBuffer = await downloadFont(task)
-        await fs.writeFile(targetPath, fileBuffer)
-        log(`downloaded: ${task.source} -> public/fonts/${task.filename}`)
-      } catch (error) {
-        log(`failed: ${task.source} -> public/fonts/${task.filename} (${error.message})`)
-      }
-    }
-  }
-
-  return {
-    name: "font-download-plugin",
-    async configureServer() {
-      if (checkedInServe) return
-      checkedInServe = true
-      await ensureFonts()
-    },
-    async buildStart() {
-      await ensureFonts()
-    },
-  }
-}
 
-function searchIndexPlugin() {
-  return {
-    name: 'search-index-plugin',
-    configureServer(server) {
-      const publicDir = path.resolve(__dirname, 'public')
-      const docsDir = path.resolve(publicDir, 'docs')
-      
-      server.watcher.add(docsDir)
-      
-      let generating = false
-      let pending = false
-      
-      const generateIndex = () => {
-        if (generating) {
-          pending = true
-          return
+        if (!response.body) {
+            throw new Error("response body is empty");
         }
-        generating = true
-        
-        const child = spawn('node', ['scripts/generate-search-index.js'], {
-          cwd: path.resolve(__dirname),
-          stdio: 'inherit'
-        })
-        
-        child.on('close', () => {
-          generating = false
-          if (pending) {
-            pending = false
-            generateIndex()
-          }
-        })
-      }
-      
-      generateIndex()
-      
-      const isDocFile = (file) => {
-        return file.includes(path.sep + 'docs' + path.sep) && 
-               (file.endsWith('.md') || file.endsWith('.mdx'))
-      }
-      
-      const debounce = (fn, delay) => {
-        let timer = null
-        return (...args) => {
-          if (timer) clearTimeout(timer)
-          timer = setTimeout(() => fn(...args), delay)
+
+        const totalBytes = Number(response.headers.get("content-length") || 0);
+        const reader = response.body.getReader();
+        const chunks = [];
+        const startedAt = Date.now();
+        let downloadedBytes = 0;
+        let lastLogAt = 0;
+
+        log(`start: ${task.filename} <- ${task.source}`);
+
+        while (true) {
+            const { done, value } = await reader.read();
+            if (done) break;
+
+            const chunk = Buffer.from(value);
+            chunks.push(chunk);
+            downloadedBytes += chunk.byteLength;
+
+            const now = Date.now();
+            if (
+                lastLogAt === 0 ||
+                now - lastLogAt >= 500 ||
+                (totalBytes > 0 && downloadedBytes >= totalBytes)
+            ) {
+                const elapsedSeconds = Math.max(
+                    (now - startedAt) / 1000,
+                    0.001,
+                );
+                const speed = downloadedBytes / elapsedSeconds;
+                const progress =
+                    totalBytes > 0
+                        ? `${((downloadedBytes / totalBytes) * 100).toFixed(1)}%`
+                        : "unknown";
+                const totalText =
+                    totalBytes > 0 ? formatBytes(totalBytes) : "unknown";
+
+                log(
+                    `progress: ${task.filename} ${formatBytes(downloadedBytes)}/${totalText} (${progress}) @ ${formatBytes(speed)}/s`,
+                );
+                lastLogAt = now;
+            }
         }
-      }
-      
-      const debouncedGenerate = debounce(generateIndex, 500)
-      
-      server.watcher.on('change', (file) => {
-        if (isDocFile(file)) debouncedGenerate()
-      })
-      
-      server.watcher.on('add', (file) => {
-        if (isDocFile(file)) debouncedGenerate()
-      })
-      
-      server.watcher.on('unlink', (file) => {
-        if (isDocFile(file)) debouncedGenerate()
-      })
-    }
-  }
-}
 
-function publicHmrPlugin() {
-  return {
-    name: 'public-hmr',
-    configureServer(server) {
-      const publicDir = path.resolve(__dirname, 'public')
-      const configDir = path.resolve(publicDir, 'config')
-      const docsDir = path.resolve(publicDir, 'docs')
-
-      server.watcher.add([configDir, docsDir])
-
-      const isTargetFile = (file) => {
-        const relativePath = path.relative(publicDir, file)
-        return (
-          relativePath.startsWith('config' + path.sep) && file.endsWith('.yaml')
-        ) || (
-          relativePath.startsWith('docs' + path.sep) &&
-          (file.endsWith('.md') || file.endsWith('.mdx'))
-        )
-      }
-
-      const triggerReload = (file) => {
-        if (isTargetFile(file)) {
-          server.ws.send({ type: 'full-reload', path: '*' })
+        return Buffer.concat(chunks);
+    };
+
+    const ensureFonts = async () => {
+        const root = path.resolve(__dirname);
+        const configDir = path.resolve(root, "public", "config");
+        const fontsDir = path.resolve(root, "public", "fonts");
+
+        await fs.mkdir(fontsDir, { recursive: true });
+
+        const tasks = new Map();
+        for (const fileName of ["site.yaml", "site.en.yaml"]) {
+            const filePath = path.resolve(configDir, fileName);
+            try {
+                const content = await fs.readFile(filePath, "utf8");
+                const parsed = yaml.load(content) || {};
+                const entries = parsed?.fonts?.downloadFonts || [];
+
+                for (const entry of entries) {
+                    const normalized = String(entry || "").trim();
+                    if (!normalized) continue;
+
+                    const url = /^https?:\/\//i.test(normalized)
+                        ? new URL(normalized)
+                        : new URL(
+                              normalized.replace(/^\/+/, ""),
+                              FONT_BASE_URL,
+                          );
+
+                    const filename = path.posix.basename(url.pathname);
+                    if (filename) {
+                        tasks.set(filename, {
+                            filename,
+                            source: url.toString(),
+                        });
+                    }
+                }
+            } catch (error) {
+                if (error?.code !== "ENOENT") {
+                    log(`failed to read ${fileName}: ${error.message}`);
+                }
+            }
         }
-      }
 
-      server.watcher.on('change', triggerReload)
-      server.watcher.on('add', triggerReload)
-    }
-  }
+        if (tasks.size === 0) {
+            log(
+                "no fonts.downloadFonts entries found in public/config/site*.yaml",
+            );
+            return;
+        }
+
+        for (const task of tasks.values()) {
+            const targetPath = path.resolve(fontsDir, task.filename);
+
+            try {
+                await fs.access(targetPath);
+                log(`exists: public/fonts/${task.filename}`);
+                continue;
+            } catch {
+                // Continue to download.
+            }
+
+            try {
+                const fileBuffer = await downloadFont(task);
+                await fs.writeFile(targetPath, fileBuffer);
+                log(
+                    `downloaded: ${task.source} -> public/fonts/${task.filename}`,
+                );
+            } catch (error) {
+                log(
+                    `failed: ${task.source} -> public/fonts/${task.filename} (${error.message})`,
+                );
+            }
+        }
+    };
+
+    return {
+        name: "font-download-plugin",
+        async configureServer() {
+            if (checkedInServe) return;
+            checkedInServe = true;
+            await ensureFonts();
+        },
+        async buildStart() {
+            await ensureFonts();
+        },
+    };
+}
+
+function searchIndexPlugin() {
+    return {
+        name: "search-index-plugin",
+        configureServer(server) {
+            const publicDir = path.resolve(__dirname, "public");
+            const docsDir = path.resolve(publicDir, "docs");
+
+            server.watcher.add(docsDir);
+
+            let generating = false;
+            let pending = false;
+
+            const generateIndex = () => {
+                if (generating) {
+                    pending = true;
+                    return;
+                }
+                generating = true;
+
+                const child = spawn(
+                    "node",
+                    ["scripts/generate-search-index.js"],
+                    {
+                        cwd: path.resolve(__dirname),
+                        stdio: "inherit",
+                    },
+                );
+
+                child.on("close", () => {
+                    generating = false;
+                    if (pending) {
+                        pending = false;
+                        generateIndex();
+                    }
+                });
+            };
+
+            generateIndex();
+
+            const isDocFile = (file) => {
+                return (
+                    file.includes(path.sep + "docs" + path.sep) &&
+                    (file.endsWith(".md") || file.endsWith(".mdx"))
+                );
+            };
+
+            const debounce = (fn, delay) => {
+                let timer = null;
+                return (...args) => {
+                    if (timer) clearTimeout(timer);
+                    timer = setTimeout(() => fn(...args), delay);
+                };
+            };
+
+            const debouncedGenerate = debounce(generateIndex, 500);
+
+            server.watcher.on("change", (file) => {
+                if (isDocFile(file)) debouncedGenerate();
+            });
+
+            server.watcher.on("add", (file) => {
+                if (isDocFile(file)) debouncedGenerate();
+            });
+
+            server.watcher.on("unlink", (file) => {
+                if (isDocFile(file)) debouncedGenerate();
+            });
+        },
+    };
+}
+
+function publicHmrPlugin() {
+    return {
+        name: "public-hmr",
+        configureServer(server) {
+            const publicDir = path.resolve(__dirname, "public");
+            const configDir = path.resolve(publicDir, "config");
+            const docsDir = path.resolve(publicDir, "docs");
+
+            server.watcher.add([configDir, docsDir]);
+
+            const isTargetFile = (file) => {
+                const relativePath = path.relative(publicDir, file);
+                return (
+                    (relativePath.startsWith("config" + path.sep) &&
+                        file.endsWith(".yaml")) ||
+                    (relativePath.startsWith("docs" + path.sep) &&
+                        (file.endsWith(".md") || file.endsWith(".mdx")))
+                );
+            };
+
+            const triggerReload = (file) => {
+                if (isTargetFile(file)) {
+                    server.ws.send({ type: "full-reload", path: "*" });
+                }
+            };
+
+            server.watcher.on("change", triggerReload);
+            server.watcher.on("add", triggerReload);
+        },
+    };
 }
 
 export default defineConfig({
-  plugins: [
-    react(),
-    mdxComponentsPlugin({
-      componentsPath: './src/components',
-      outputPath: './src/generated/mdx-components.ts'
-    }),
-    fontDownloadPlugin(),
-    searchIndexPlugin(),
-    publicHmrPlugin()
-  ],
-  resolve: {
-    alias: {
-      "@": "src",
-      buffer: "buffer",
+    plugins: [
+        react(),
+        mdxComponentsPlugin({
+            componentsPath: "./src/components",
+            outputPath: "./src/generated/mdx-components.ts",
+        }),
+        fontDownloadPlugin(),
+        searchIndexPlugin(),
+        publicHmrPlugin(),
+    ],
+    resolve: {
+        alias: {
+            "@": "src",
+            buffer: "buffer",
+        },
+    },
+    define: {
+        global: "globalThis",
+    },
+    server: {
+        host: "0.0.0.0",
+        port: 5173,
+    },
+    build: {
+        chunkSizeWarningLimit: 2000,
     },
-  },
-  define: {
-    global: 'globalThis',
-  },
-  server: {
-    host: "0.0.0.0",
-    port: 5173,
-  },
-  build: {
-    chunkSizeWarningLimit: 2000
-  }
-})
+});