131 lines
3.5 KiB
TypeScript
131 lines
3.5 KiB
TypeScript
import { resolve } from "node:path";
|
||
import { defineConfig } from "vitepress";
|
||
import {
|
||
componentPreview,
|
||
containerPreview
|
||
} from "@vitepress-demo-preview/plugin";
|
||
import AutoImport from "unplugin-auto-import/vite";
|
||
import { groupByCategory, toDocLink } from "./components";
|
||
import { docgenPlugin } from "./plugins/docgen";
|
||
import { timiWebSsrStub } from "./plugins/ssr-stub";
|
||
|
||
/** `__dirname` 由 VitePress 打包配置时注入,指向 `docs/.vitepress`。 */
|
||
const docsDir = resolve(__dirname, "..");
|
||
/** 仓库根目录,组件源码位于它的 `src` 下。 */
|
||
const repoRoot = resolve(docsDir, "..");
|
||
/** timi-web 仓库目录,docs 通过 link 依赖它。 */
|
||
const timiWebRoot = resolve(repoRoot, "../timi-web");
|
||
|
||
/**
|
||
* 源码引用别名。
|
||
*
|
||
* demo 直接引用 `src` 源码而非构建产物,改组件即可热更新文档。
|
||
* 组件源码自身的传递依赖(tiptap、prismjs 等)由 timi-web 的 node_modules 解析,
|
||
* docs 无需重复声明。
|
||
*/
|
||
const alias = {
|
||
"timi-tdesign-mobile": resolve(repoRoot, "src/index.ts"),
|
||
"timi-web/editor": resolve(timiWebRoot, "src/editor/index.ts")
|
||
};
|
||
|
||
/** 组件文档侧边栏,按 components.ts 的分类与顺序生成。 */
|
||
const componentSidebar = groupByCategory().map(group => ({
|
||
text: group.category,
|
||
collapsed: false,
|
||
items: group.items.map(item => ({
|
||
text: item.title,
|
||
link: toDocLink(item)
|
||
}))
|
||
}));
|
||
|
||
export default defineConfig({
|
||
title: "timi-tdesign-mobile",
|
||
description: "移动端 TDesign 组件库的演示与 API 文档",
|
||
lang: "zh-CN",
|
||
cleanUrls: true,
|
||
|
||
themeConfig: {
|
||
nav: [
|
||
{ text: "指南", link: "/guide/" },
|
||
{ text: "场景", link: "/scenarios/editor" },
|
||
{ text: "组件", link: "/components/" }
|
||
],
|
||
sidebar: [
|
||
{
|
||
text: "指南",
|
||
items: [
|
||
{ text: "快速开始", link: "/guide/" },
|
||
{ text: "演示与文档约定", link: "/guide/demo" }
|
||
]
|
||
},
|
||
{
|
||
text: "场景示例",
|
||
collapsed: false,
|
||
items: [
|
||
{ text: "编辑器能力总览", link: "/scenarios/editor" },
|
||
{ text: "文章编辑与预览", link: "/scenarios/article" },
|
||
{ text: "通知编辑与预览", link: "/scenarios/notify" },
|
||
{ text: "移动端组件", link: "/scenarios/mobile" },
|
||
{ text: "AI 对话", link: "/scenarios/ai" }
|
||
]
|
||
},
|
||
...componentSidebar
|
||
],
|
||
outline: {
|
||
level: [2, 3],
|
||
label: "本页目录"
|
||
},
|
||
search: {
|
||
provider: "local"
|
||
},
|
||
docFooter: {
|
||
prev: "上一篇",
|
||
next: "下一篇"
|
||
},
|
||
darkModeSwitchLabel: "主题",
|
||
sidebarMenuLabel: "目录",
|
||
returnToTopLabel: "回到顶部"
|
||
},
|
||
|
||
markdown: {
|
||
theme: {
|
||
light: "vitesse-light",
|
||
dark: "vitesse-dark"
|
||
},
|
||
lineNumbers: true,
|
||
config(md) {
|
||
// 组件依赖浏览器 API(Tiptap、Prism、ResizeObserver、SSE 等),
|
||
// 统一开启 clientOnly 交给浏览器渲染,避免 SSR 阶段报错。
|
||
md.use(componentPreview, { clientOnly: true, alias });
|
||
md.use(containerPreview, { clientOnly: true, alias });
|
||
}
|
||
},
|
||
|
||
vite: {
|
||
resolve: {
|
||
alias
|
||
},
|
||
|
||
plugins: [
|
||
// 必须最先执行:SSR 阶段拦截 timi-web,否则整个构建无法通过。
|
||
timiWebSsrStub(docsDir),
|
||
docgenPlugin(repoRoot),
|
||
// src 源码依赖自动导入(内部没有显式 import vue 的文件不在少数),
|
||
// 这里仅为其提供支持;docs 自身的代码一律显式导入。
|
||
AutoImport({
|
||
imports: ["vue"],
|
||
dts: false
|
||
})
|
||
],
|
||
|
||
server: {
|
||
port: 3004,
|
||
host: true,
|
||
fs: {
|
||
// demo 需要读取 docs 之外的 src 与 timi-web 源码。
|
||
allow: [repoRoot, timiWebRoot]
|
||
}
|
||
}
|
||
}
|
||
});
|