简介
第一个组件,主要是学习组件的写法和用法。
基本用法
在 Markdown文档中添加以下内容:
markdown
<MtDataLoader />
效果
页面数据:
{ "title": "LV01-DataLoader数据加载", "description": null, "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17T11:15:52.000Z", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "headers": [], "relativePath": "sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.md", "filePath": "sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.md" }
站点数据:
{ "lang": "en-US", "dir": "ltr", "title": "vitepress-theme-mist", "description": "Mist Instruction Manual", "base": "/vitepress-theme-mist/", "head": [], "router": { "prefetchLinks": true }, "appearance": true, "themeConfig": { "useTheme": true, "articleShare": { "enabled": true }, "themeName": "vitepress-theme-mist", "themeEnhance": { "enabled": true, "position": "top" }, "codeBlock": { "disabled": false, "collapseHeight": 500, "overlay": false, "overlayHeight": 400, "langTextTransform": "lowercase" }, "clickEffect": { "enabled": true }, "nav": [ { "text": "开发", "link": "/sdoc/01-开发/", "activeMatch": "/sdoc/01-开发/" }, { "text": "组件", "items": [ { "text": "公共组件", "link": "/sdoc/02-组件/01-公共组件/", "activeMatch": "/sdoc/02-组件/01-公共组件/" }, { "text": "主题组件", "link": "/sdoc/02-组件/02-主题组件/", "activeMatch": "/sdoc/02-组件/02-主题组件/" } ], "activeMatch": "/sdoc/02-组件/" }, { "text": "插件", "link": "/sdoc/03-插件/", "activeMatch": "/sdoc/03-插件/" }, { "text": "功能页", "items": [ { "text": "导航页", "link": "/@pages/Navigation" } ] } ], "sidebar": { "/sdoc/01-开发/": [ { "text": "LV01-pnpm工作区", "link": "/sdoc/01-开发/LV01-pnpm工作区" }, { "text": "LV02-TS路径映射与包作用域", "link": "/sdoc/01-开发/LV02-TS路径映射与包作用域" }, { "text": "LV03-主题入口分析", "link": "/sdoc/01-开发/LV03-主题入口分析" }, { "text": "LV04-主题配置", "link": "/sdoc/01-开发/LV04-主题配置" }, { "text": "LV05-DataLoader组件分析", "link": "/sdoc/01-开发/LV05-DataLoader组件分析" }, { "text": "LV06-SCSS变量未展开问题分析", "link": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析" }, { "text": "LV07-Vite插件", "link": "/sdoc/01-开发/LV07-Vite插件" }, { "text": "LV08-Git提交规范与工具集成", "link": "/sdoc/01-开发/LV08-Git提交规范与工具集成" } ], "/sdoc/02-组件/": [ { "text": "公共组件", "collapsed": true, "items": [ { "text": "LV01-DataLoader数据加载", "link": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载" }, { "text": "LV02-BackTop回到顶部", "link": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部" }, { "text": "LV03-TransitionCollapse折叠", "link": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠" }, { "text": "LV04-InputSlide滑动输入", "link": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入" }, { "text": "LV05-Icon图标", "link": "/sdoc/02-组件/01-公共组件/LV05-Icon图标" }, { "text": "LV06-Button按钮", "link": "/sdoc/02-组件/01-公共组件/LV06-Button按钮" }, { "text": "LV07-Message消息提示", "link": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示" }, { "text": "LV08-Popover气泡卡片", "link": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片" }, { "text": "LV09-Segmented分段器", "link": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器" }, { "text": "LV10-ArticlePage文章页", "link": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页" }, { "text": "LV11-Breadcrumb面包屑", "link": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑" } ], "collapsible": true }, { "text": "主题组件", "collapsed": true, "items": [ { "text": "LV01-Democode组件", "link": "/sdoc/02-组件/02-主题组件/LV01-Democode组件" }, { "text": "LV02-ArticleBreadcrumb文章面包屑", "link": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑" }, { "text": "LV03-ArticleInfo文章信息", "link": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息" } ], "collapsible": true } ], "/sdoc/03-插件/": [ { "text": "LV01-file-content-loader", "link": "/sdoc/03-插件/LV01-file-content-loader" }, { "text": "LV02-catalogue分析文档", "link": "/sdoc/03-插件/LV02-catalogue分析文档" } ], "/sdoc/index.md": [] }, "logo": "/favicon.svg", "docFooter": { "prev": "上一篇", "next": "下一篇" }, "outline": { "label": "页面导航", "level": [ 2, 6 ] }, "socialLinks": [ { "icon": "github", "link": "https://github.com/docs-site/vitepress-theme-mist.git" } ], "docAnalysisInfo": { "fileList": [ { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/Examples/api-examples.md", "relativePath": "Examples/api-examples.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/Examples/index.md", "relativePath": "Examples/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/Examples/markdown-examples.md", "relativePath": "Examples/markdown-examples.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV01-pnpm工作区.md", "relativePath": "sdoc/01-开发/LV01-pnpm工作区.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV02-TS路径映射与包作用域.md", "relativePath": "sdoc/01-开发/LV02-TS路径映射与包作用域.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV03-主题入口分析.md", "relativePath": "sdoc/01-开发/LV03-主题入口分析.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV04-主题配置.md", "relativePath": "sdoc/01-开发/LV04-主题配置.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV05-DataLoader组件分析.md", "relativePath": "sdoc/01-开发/LV05-DataLoader组件分析.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV06-SCSS变量未展开问题分析.md", "relativePath": "sdoc/01-开发/LV06-SCSS变量未展开问题分析.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV07-Vite插件.md", "relativePath": "sdoc/01-开发/LV07-Vite插件.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV08-Git提交规范与工具集成.md", "relativePath": "sdoc/01-开发/LV08-Git提交规范与工具集成.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/index.md", "relativePath": "sdoc/01-开发/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.md", "relativePath": "sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.md", "relativePath": "sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.md", "relativePath": "sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.md", "relativePath": "sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV05-Icon图标.md", "relativePath": "sdoc/02-组件/01-公共组件/LV05-Icon图标.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV06-Button按钮.md", "relativePath": "sdoc/02-组件/01-公共组件/LV06-Button按钮.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV07-Message消息提示.md", "relativePath": "sdoc/02-组件/01-公共组件/LV07-Message消息提示.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.md", "relativePath": "sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.md", "relativePath": "sdoc/02-组件/01-公共组件/LV09-Segmented分段器.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.md", "relativePath": "sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.md", "relativePath": "sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/index.md", "relativePath": "sdoc/02-组件/01-公共组件/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/LV01-Democode组件.md", "relativePath": "sdoc/02-组件/02-主题组件/LV01-Democode组件.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.md", "relativePath": "sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.md", "relativePath": "sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/index.md", "relativePath": "sdoc/02-组件/02-主题组件/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/index.md", "relativePath": "sdoc/02-组件/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/03-插件/LV01-file-content-loader.md", "relativePath": "sdoc/03-插件/LV01-file-content-loader.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/03-插件/LV02-catalogue分析文档.md", "relativePath": "sdoc/03-插件/LV02-catalogue分析文档.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/03-插件/index.md", "relativePath": "sdoc/03-插件/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/index.md", "relativePath": "sdoc/index.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/test/articlePage/aside.md", "relativePath": "test/articlePage/aside.md" }, { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/test/articlePage/doc.md", "relativePath": "test/articlePage/doc.md" } ], "totalFileWords": 50839, "eachFileWords": [ { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/Examples/api-examples.md", "relativePath": "Examples/api-examples.md" }, "wordCount": 119, "readingTime": "1m", "frontmatter": { "outline": "deep" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/Examples/index.md", "relativePath": "Examples/index.md" }, "wordCount": 11, "readingTime": "1m", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/Examples/markdown-examples.md", "relativePath": "Examples/markdown-examples.md" }, "wordCount": 133, "readingTime": "1m", "frontmatter": {} }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV01-pnpm工作区.md", "relativePath": "sdoc/01-开发/LV01-pnpm工作区.md" }, "wordCount": 4440, "readingTime": "19.4m", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV02-TS路径映射与包作用域.md", "relativePath": "sdoc/01-开发/LV02-TS路径映射与包作用域.md" }, "wordCount": 6700, "readingTime": "26.3m", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV03-主题入口分析.md", "relativePath": "sdoc/01-开发/LV03-主题入口分析.md" }, "wordCount": 390, "readingTime": "1.7m", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV04-主题配置.md", "relativePath": "sdoc/01-开发/LV04-主题配置.md" }, "wordCount": 4427, "readingTime": "19.7m", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV05-DataLoader组件分析.md", "relativePath": "sdoc/01-开发/LV05-DataLoader组件分析.md" }, "wordCount": 1951, "readingTime": "8m", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV06-SCSS变量未展开问题分析.md", "relativePath": "sdoc/01-开发/LV06-SCSS变量未展开问题分析.md" }, "wordCount": 2431, "readingTime": "11.6m", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV07-Vite插件.md", "relativePath": "sdoc/01-开发/LV07-Vite插件.md" }, "wordCount": 2092, "readingTime": "8.9m", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/LV08-Git提交规范与工具集成.md", "relativePath": "sdoc/01-开发/LV08-Git提交规范与工具集成.md" }, "wordCount": 6757, "readingTime": "29.3m", "frontmatter": {} }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/01-开发/index.md", "relativePath": "sdoc/01-开发/index.md" }, "wordCount": 15, "readingTime": "1m", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.md", "relativePath": "sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.md" }, "wordCount": 50, "readingTime": "1m", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.md", "relativePath": "sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.md" }, "wordCount": 78, "readingTime": "1m", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.md", "relativePath": "sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.md" }, "wordCount": 186, "readingTime": "1m", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.md", "relativePath": "sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.md" }, "wordCount": 963, "readingTime": "4.1m", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV05-Icon图标.md", "relativePath": "sdoc/02-组件/01-公共组件/LV05-Icon图标.md" }, "wordCount": 1608, "readingTime": "8.5m", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV06-Button按钮.md", "relativePath": "sdoc/02-组件/01-公共组件/LV06-Button按钮.md" }, "wordCount": 1088, "readingTime": "4.8m", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV07-Message消息提示.md", "relativePath": "sdoc/02-组件/01-公共组件/LV07-Message消息提示.md" }, "wordCount": 1102, "readingTime": "4.8m", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.md", "relativePath": "sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.md" }, "wordCount": 2339, "readingTime": "10.5m", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.md", "relativePath": "sdoc/02-组件/01-公共组件/LV09-Segmented分段器.md" }, "wordCount": 1519, "readingTime": "7.1m", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.md", "relativePath": "sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.md" }, "wordCount": 495, "readingTime": "2m", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.md", "relativePath": "sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.md" }, "wordCount": 1118, "readingTime": "4.6m", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/01-公共组件/index.md", "relativePath": "sdoc/02-组件/01-公共组件/index.md" }, "wordCount": 17, "readingTime": "1m", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/LV01-Democode组件.md", "relativePath": "sdoc/02-组件/02-主题组件/LV01-Democode组件.md" }, "wordCount": 2830, "readingTime": "12.2m", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.md", "relativePath": "sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.md" }, "wordCount": 998, "readingTime": "4.2m", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.md", "relativePath": "sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.md" }, "wordCount": 1119, "readingTime": "4.8m", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/02-主题组件/index.md", "relativePath": "sdoc/02-组件/02-主题组件/index.md" }, "wordCount": 17, "readingTime": "1m", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/02-组件/index.md", "relativePath": "sdoc/02-组件/index.md" }, "wordCount": 15, "readingTime": "1m", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/03-插件/LV01-file-content-loader.md", "relativePath": "sdoc/03-插件/LV01-file-content-loader.md" }, "wordCount": 2337, "readingTime": "9.8m", "frontmatter": {} }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/03-插件/LV02-catalogue分析文档.md", "relativePath": "sdoc/03-插件/LV02-catalogue分析文档.md" }, "wordCount": 3254, "readingTime": "13.9m", "frontmatter": {} }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/03-插件/index.md", "relativePath": "sdoc/03-插件/index.md" }, "wordCount": 8, "readingTime": "1m", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/sdoc/index.md", "relativePath": "sdoc/index.md" }, "wordCount": 15, "readingTime": "1m", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/test/articlePage/aside.md", "relativePath": "test/articlePage/aside.md" }, "wordCount": 161, "readingTime": "1m", "frontmatter": { "layout": false } }, { "fileInfo": { "filePath": "/home/runner/work/vitepress-theme-mist/vitepress-theme-mist/docs/src/test/articlePage/doc.md", "relativePath": "test/articlePage/doc.md" }, "wordCount": 56, "readingTime": "1m", "frontmatter": { "layout": false } } ], "lastCommitTime": "2025-08-25 22:22:28" }, "catalogues": { "arr": [ { "filePath": "sdoc/01-开发/index", "path": "sdoc/01-开发", "catalogues": [ { "title": "LV01-pnpm的工作区", "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-TS路径映射与包作用域", "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-LV01-主题入口分析", "url": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV04-主题配置", "url": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV05-DataLoader组件分析", "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-SCSS变量未展开问题分析", "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV07-Vite插件", "url": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV08-Git提交规范与工具集成", "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {} } ] }, { "filePath": "sdoc/02-组件/01-公共组件/index", "path": "sdoc/02-组件/01-公共组件", "catalogues": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ] }, { "filePath": "sdoc/02-组件/02-主题组件/index", "path": "sdoc/02-组件/02-主题组件", "catalogues": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ] }, { "filePath": "sdoc/02-组件/index", "path": "sdoc/02-组件", "catalogues": [ { "title": "01-公共组件", "children": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} }, { "title": "02-主题组件", "children": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} } ] }, { "filePath": "sdoc/03-插件/index", "path": "sdoc/03-插件", "catalogues": [ { "title": "LV01-file-content-loader", "url": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {} }, { "title": "LV02-catalogue分析文档", "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {} } ] }, { "filePath": "sdoc/index", "path": "sdoc", "catalogues": [ { "title": "01-开发", "children": [ { "title": "LV01-pnpm的工作区", "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-TS路径映射与包作用域", "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-LV01-主题入口分析", "url": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV04-主题配置", "url": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV05-DataLoader组件分析", "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-SCSS变量未展开问题分析", "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV07-Vite插件", "url": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV08-Git提交规范与工具集成", "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {} } ], "frontmatter": {} }, { "title": "02-组件", "children": [ { "title": "01-公共组件", "children": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} }, { "title": "02-主题组件", "children": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} } ], "frontmatter": {} }, { "title": "03-插件", "children": [ { "title": "LV01-file-content-loader", "url": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {} }, { "title": "LV02-catalogue分析文档", "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {} } ], "frontmatter": {} } ] } ], "map": { "sdoc/01-开发/index": { "url": "sdoc/01-开发/index.html", "path": "sdoc/01-开发", "catalogues": [ { "title": "LV01-pnpm的工作区", "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-TS路径映射与包作用域", "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-LV01-主题入口分析", "url": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV04-主题配置", "url": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV05-DataLoader组件分析", "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-SCSS变量未展开问题分析", "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV07-Vite插件", "url": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV08-Git提交规范与工具集成", "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {} } ] }, "sdoc/02-组件/01-公共组件/index": { "url": "sdoc/02-组件/01-公共组件/index.html", "path": "sdoc/02-组件/01-公共组件", "catalogues": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ] }, "sdoc/02-组件/02-主题组件/index": { "url": "sdoc/02-组件/02-主题组件/index.html", "path": "sdoc/02-组件/02-主题组件", "catalogues": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ] }, "sdoc/02-组件/index": { "url": "sdoc/02-组件/index.html", "path": "sdoc/02-组件", "catalogues": [ { "title": "01-公共组件", "children": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} }, { "title": "02-主题组件", "children": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} } ] }, "sdoc/03-插件/index": { "url": "sdoc/03-插件/index.html", "path": "sdoc/03-插件", "catalogues": [ { "title": "LV01-file-content-loader", "url": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {} }, { "title": "LV02-catalogue分析文档", "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {} } ] }, "sdoc/index": { "url": "sdoc/index.html", "path": "sdoc", "catalogues": [ { "title": "01-开发", "children": [ { "title": "LV01-pnpm的工作区", "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-TS路径映射与包作用域", "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-LV01-主题入口分析", "url": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV04-主题配置", "url": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV05-DataLoader组件分析", "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-SCSS变量未展开问题分析", "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV07-Vite插件", "url": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV08-Git提交规范与工具集成", "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {} } ], "frontmatter": {} }, { "title": "02-组件", "children": [ { "title": "01-公共组件", "children": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} }, { "title": "02-主题组件", "children": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} } ], "frontmatter": {} }, { "title": "03-插件", "children": [ { "title": "LV01-file-content-loader", "url": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {} }, { "title": "LV02-catalogue分析文档", "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {} } ], "frontmatter": {} } ] } }, "inv": { "sdoc/01-开发": { "url": "sdoc/01-开发/index.html", "filePath": "sdoc/01-开发/index", "catalogues": [ { "title": "LV01-pnpm的工作区", "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-TS路径映射与包作用域", "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-LV01-主题入口分析", "url": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV04-主题配置", "url": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV05-DataLoader组件分析", "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-SCSS变量未展开问题分析", "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV07-Vite插件", "url": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV08-Git提交规范与工具集成", "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {} } ] }, "sdoc/02-组件/01-公共组件": { "url": "sdoc/02-组件/01-公共组件/index.html", "filePath": "sdoc/02-组件/01-公共组件/index", "catalogues": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ] }, "sdoc/02-组件/02-主题组件": { "url": "sdoc/02-组件/02-主题组件/index.html", "filePath": "sdoc/02-组件/02-主题组件/index", "catalogues": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ] }, "sdoc/02-组件": { "url": "sdoc/02-组件/index.html", "filePath": "sdoc/02-组件/index", "catalogues": [ { "title": "01-公共组件", "children": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} }, { "title": "02-主题组件", "children": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} } ] }, "sdoc/03-插件": { "url": "sdoc/03-插件/index.html", "filePath": "sdoc/03-插件/index", "catalogues": [ { "title": "LV01-file-content-loader", "url": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {} }, { "title": "LV02-catalogue分析文档", "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {} } ] }, "sdoc": { "url": "sdoc/index.html", "filePath": "sdoc/index", "catalogues": [ { "title": "01-开发", "children": [ { "title": "LV01-pnpm的工作区", "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-TS路径映射与包作用域", "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-LV01-主题入口分析", "url": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV04-主题配置", "url": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV05-DataLoader组件分析", "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-SCSS变量未展开问题分析", "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV07-Vite插件", "url": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV08-Git提交规范与工具集成", "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {} } ], "frontmatter": {} }, { "title": "02-组件", "children": [ { "title": "01-公共组件", "children": [ { "title": "LV01-DataLoader数据加载", "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-BackTop回到顶部", "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-TransitionCollapse折叠", "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": {}, "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" } }, { "title": "LV04-InputSlide滑动输入", "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": {}, "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" } }, { "title": "LV05-Icon 图标", "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": {}, "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV06-Button按钮", "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": {}, "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" } }, { "title": "LV07-Message消息提示", "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" } }, { "title": "LV08-Popover气泡卡片", "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": {}, "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" } }, { "title": "LV09-Segmented分段器", "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" } }, { "title": "LV10-ArticlePage文章页", "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV11-Breadcrumb面包屑", "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} }, { "title": "02-主题组件", "children": [ { "title": "LV01-Democode组件", "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": {}, "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV02-ArticleBreadcrumb文章面包屑", "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": {}, "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } }, { "title": "LV03-ArticleInfo文章信息", "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": {}, "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null } } ], "frontmatter": {} } ], "frontmatter": {} }, { "title": "03-插件", "children": [ { "title": "LV01-file-content-loader", "url": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {} }, { "title": "LV02-catalogue分析文档", "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {} } ], "frontmatter": {} } ] } } }, "posts": { "allPosts": [ { "url": "/@pages/Navigation.html", "relativePath": "/@pages/Navigation.html", "frontmatter": { "title": "我的导航", "Navigation": true, "layout": "page", "article": false, "sidebar": false, "navigationData": [ { "title": "常用工具", "items": [ { "icon": "https://www.ico51.cn/images/logo.png", "title": "在线制作ico透明图标", "badge": { "text": "ico", "type": "info" }, "desc": "ico透明图标", "link": "https://www.ico51.cn/" }, { "icon": "/icons/stylus.svg", "title": "stylus-css", "badge": { "text": "stylus", "type": "tip" }, "desc": "stylus-to-css", "link": "https://verytoolz.com/stylus-css.html" }, { "icon": "https://www.lddgo.net/img/icon-1732875babb6f45ec2e61eaf37a1c0f0.png", "title": "YAML-JSON 转换", "badge": { "text": "yaml", "type": "warning" }, "desc": "yaml-to-json", "link": "https://www.lddgo.net/convert/yaml-to-json" }, { "icon": "https://tool.lu/favicon.ico", "title": "在线工具", "badge": { "text": "tool", "type": "danger" }, "desc": "开发人员的工具箱", "link": "https://tool.lu" }, { "icon": "/icons/SVG-file.svg", "title": "svg", "badge": { "text": "tool", "type": "danger" }, "desc": "一个在线svg编辑器", "link": "https://www.tuyitu.com/svg/" } ] }, { "title": "AI 导航", "items": [ { "icon": "\thttps://ts4.tc.mm.bing.net/th/id/ODF.YxK1MUJaRoBfBG4UGNrXAA?w=32&h=32&qlt=90&pcl=fffffa&o=6&pid=1.2", "title": "Deepseek", "link": "https://chat.deepseek.com/" }, { "icon": "https://ts3.tc.mm.bing.net/th/id/ODF.T0iTu20w8jwu9conMCwNGw?w=32&h=32&qlt=90&pcl=fffffc&o=6&pid=1.2", "title": "百度AI", "link": "https://chat.baidu.com/search?isShowHello=1&extParams=%7B%22enter_type%22%3A%22plugin%22%7D" } ] }, { "title": "苏木的site", "items": [ { "icon": "/images/favicon_sumu32x32.ico", "title": "苏木", "desc": "苏木", "link": "https://sumumm.github.io/" }, { "icon": "/images/favicon_sumu32x32.ico", "title": "苏木", "desc": "site-hexo", "link": "https://docs-site.github.io/site-hexo/" }, { "icon": "/icons/sumu-icon.svg", "title": "苏木", "desc": "site-vitepress", "link": "https://docs-site.github.io/site-vitepress/" }, { "icon": "/icons/vscode-document.svg", "title": "vscode", "desc": "vscode", "link": "https://docs-site.github.io/site-docsify/#/" } ] }, { "title": "site生成", "items": [ { "icon": "https://vitejs.cn/vitepress/vitepress-logo-mini.svg", "title": "VitePress", "desc": "由 Vite 和 Vue 驱动的静态站点生成器", "link": "https://vitejs.cn/vitepress/" }, { "icon": "https://vuepress.vuejs.org/images/hero.png", "title": "VuePress", "desc": "Vue 驱动的静态网站生成器", "link": "https://vuepress.vuejs.org/zh/" }, { "icon": "https://docsify.js.org/_media/icon.svg", "title": "docsify", "desc": "一个神奇的文档网站生成器。", "link": "https://docsify.js.org/#/" }, { "icon": "https://hexo.io/logo.svg", "title": "Hexo", "desc": "快速、简洁且高效的博客框架", "link": "https://hexo.io/zh-cn/" } ] }, { "title": "site参考", "items": [ { "icon": "https://vitepress.yiov.top/logo.png", "title": "vitepress-doc", "desc": "Yiov/vitepress-doc", "link": "https://vitepress.yiov.top/" }, { "icon": "https://i.theojs.cn/logo/lumen-logo-mini.svg", "title": "s-theo/lumen", "desc": "专为 VitePress 打造的主题美化与 Vue 扩展组件库", "link": "https://lumen.theojs.cn/" }, { "icon": "https://vp.teek.top/teek-logo-mini.svg", "title": "Kele-Bingtang/vitepress-theme-teek", "desc": "一个轻量、简洁高效、灵活配置、易于扩展的 VitePress 主题", "link": "https://vp.teek.top/" } ] }, { "title": "前端基础", "items": [ { "icon": "/icons/javascript.svg", "title": "JavaScript", "desc": "现代 JavaScript 教程", "link": "https://zh.javascript.info/" }, { "icon": "/icons/typescript.svg", "title": "Typescript", "desc": "具有类型语法的 JavaScript", "link": "https://ts.nodejs.cn/docs/" }, { "icon": "/icons/typescript.svg", "title": "Typescript", "desc": "TypeScript 入门教程", "link": "https://ts.xcatliu.com/" }, { "icon": "/icons/typescript.svg", "title": "Typescript", "desc": "深入理解 TypeScript", "link": "https://jkchao.github.io/typescript-book-chinese/" }, { "icon": "/icons/typescript.svg", "title": "Typescript", "desc": "TypeScript使用指南", "link": "https://typescript.uihtm.com/" } ] }, { "title": "React 生态", "items": [ { "icon": "https://zh-hans.reactjs.org/favicon.ico", "title": "React", "desc": "用于构建用户界面的 JavaScript 库", "link": "https://zh-hans.reactjs.org" }, { "icon": "https://reactrouter.com/favicon-light.png", "title": "React Router", "desc": "React 的声明式路由", "link": "https://reactrouter.com" }, { "icon": "https://nextjs.org/static/favicon/safari-pinned-tab.svg", "title": "Next.js", "desc": "一个用于 Web 的 React 框架", "link": "https://nextjs.org" }, { "icon": "https://img.alicdn.com/tfs/TB1YHEpwUT1gK0jSZFhXXaAtVXa-28-27.svg", "title": "UmiJS", "desc": "插件化的企业级前端应用框架", "link": "https://umijs.org" }, { "icon": "https://gw.alipayobjects.com/zos/rmsportal/rlpTLlbMzTNYuZGGCVYM.png", "title": "Ant Design", "desc": "一套企业级 UI 设计语言和 React 组件库", "link": "https://ant.design" }, { "icon": "https://gw.alipayobjects.com/zos/bmw-prod/69a27fcc-ce52-4f27-83f1-c44541e9b65d.svg", "title": "Ant Design Mobile", "desc": "构建移动 WEB 应用程序的 React 组件库", "link": "https://mobile.ant.design" }, { "icon": "https://docs.pmnd.rs/apple-touch-icon.png", "title": "Zustand", "desc": "一个小型、快速、可扩展的 React 状态管理解决方案", "link": "https://docs.pmnd.rs/zustand/getting-started/introduction" }, { "icon": "https://valtio.pmnd.rs/favicon.ico", "title": "Valtio", "desc": "makes proxy-state simple for React and Vanilla", "link": "https://valtio.pmnd.rs" }, { "icon": "https://jotai.org/favicon.svg", "title": "Jotai", "desc": "primitive and flexible state management for React", "link": "https://jotai.org" }, { "icon": "https://cn.redux.js.org/img/redux.svg", "title": "Redux", "desc": "JavaScript 应用的状态容器,提供可预测的状态管理", "link": "https://cn.redux.js.org" }, { "icon": "https://zh.mobx.js.org/assets/mobx.png", "title": "MobX", "desc": "一个小型、快速、可扩展的 React 状态管理解决方案", "link": "https://zh.mobx.js.org" }, { "icon": "https://ahooks.js.org/simple-logo.svg", "title": "ahooks", "desc": "一套高质量可靠的 React Hooks 库", "link": "https://ahooks.js.org/zh-CN" } ] }, { "title": "Vue 生态", "items": [ { "icon": "https://cn.vuejs.org/logo.svg", "title": "Vue 3", "desc": "渐进式 JavaScript 框架", "link": "https://cn.vuejs.org" }, { "icon": "https://cn.vuejs.org/logo.svg", "title": "Vue 2", "desc": "渐进式 JavaScript 框架", "link": "https://v2.cn.vuejs.org" }, { "icon": "https://cn.vuejs.org/logo.svg", "title": "Vue Router", "desc": "Vue.js 的官方路由\n为 Vue.js 提供富有表现力、可配置的、方便的路由", "link": "https://router.vuejs.org/zh" }, { "icon": "https://pinia.vuejs.org/logo.svg", "title": "Pinia", "desc": "符合直觉的 Vue.js 状态管理库", "link": "https://pinia.vuejs.org/zh" }, { "icon": "https://nuxt.com/icon.png", "title": "Nuxt.js", "desc": "一个基于 Vue.js 的通用应用框架", "link": "https://nuxt.com" }, { "icon": "https://vueuse.org/favicon.svg", "title": "VueUse", "desc": "Vue Composition API 的常用工具集", "link": "https://vueuse.org" }, { "icon": "https://element-plus.org/images/element-plus-logo-small.svg", "title": "Element Plus", "desc": "基于 Vue 3,面向设计师和开发者的组件库", "link": "https://element-plus.org" }, { "icon": "https://www.antdv.com/assets/logo.1ef800a8.svg", "title": "Ant Design Vue", "desc": "Ant Design 的 Vue 实现,开发和服务于企业级后台产品", "link": "https://antdv.com" }, { "icon": "https://fastly.jsdelivr.net/npm/@vant/assets/logo.png", "title": "Vant", "desc": "轻量、可定制的移动端 Vue 组件库", "link": "https://vant-ui.github.io/vant" }, { "icon": "https://webapp.didistatic.com/static/webapp/shield/Cube-UI_logo.ico", "title": "Cube UI", "desc": "基于 Vue.js 实现的精致移动端组件库", "link": "https://didi.github.io/cube-ui" }, { "icon": "https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png", "title": "NutUI", "desc": "京东风格的轻量级移动端组件库", "link": "https://nutui.jd.com" } ] }, { "title": "CSS 相关", "items": [ { "icon": "https://postcss.org/assets/logo-3e39b0aa.svg", "title": "PostCSS", "desc": "一个用 JavaScript 转换 CSS 的工具", "link": "https://postcss.org" }, { "icon": "https://sass-lang.com/assets/img/logos/logo-b6e1ef6e.svg", "title": "Sass", "desc": "一个成熟,稳定,功能强大的专业级 CSS 扩展语言", "link": "https://sass-lang.com" }, { "icon": "https://www.tailwindcss.cn/apple-touch-icon.png", "title": "TailwindCSS 中文网", "desc": "一个功能类优先的 CSS 框架", "link": "https://www.tailwindcss.cn" } ] }, { "title": "Node 相关", "items": [ { "icon": "https://avatars.githubusercontent.com/u/9950313?s=48&v=4", "title": "Node.js", "desc": "Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境", "link": "https://nodejs.org/zh-cn" }, { "icon": "https://expressjs.com/images/favicon.png", "title": "Express", "desc": "基于 Node.js 平台,快速、开放、极简的 Web 开发框架", "link": "https://expressjs.com" }, { "icon": "/icons/koa.svg", "title": "Koa", "desc": "基于 Node.js 平台的下一代 web 开发框架", "link": "https://koajs.com" }, { "icon": "https://www.eggjs.org/favicon.png", "title": "Egg", "desc": "为企业级框架和应用而生", "link": "https://www.eggjs.org/zh-CN" }, { "icon": "https://d33wubrfki0l68.cloudfront.net/e937e774cbbe23635999615ad5d7732decad182a/26072/logo-small.ede75a6b.svg", "title": "Nest.js 中文文档", "desc": "用于构建高效且可伸缩的服务端应用程序的渐进式 Node.js 框架", "link": "https://docs.nestjs.cn" } ] }, { "title": "可视化", "items": [ { "icon": "https://echarts.apache.org/zh/images/favicon.png", "title": "ECharts", "desc": "一个基于 JavaScript 的开源可视化图表库", "link": "https://echarts.apache.org/zh/index.html" }, { "icon": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*A-lcQbVTpjwAAAAAAAAAAAAADmJ7AQ/original", "title": "AntV", "desc": "蚂蚁集团全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、无限可能的数据可视化最佳实践。", "link": "https://antv.vision/zh/" }, { "icon": "https://d3js.org/logo.svg", "title": "D3.js", "desc": "一个遵循 Web 标准用于可视化数据的 JavaScript 库", "link": "https://d3js.org" }, { "icon": "https://www.chartjs.org/favicon.ico", "title": "Chart.js", "desc": "一个简单而灵活的 JavaScript 图表库", "link": "https://www.chartjs.org" }, { "icon": "https://threejs.org/files/favicon.ico", "title": "Three.js", "desc": "JavaScript 3d 库", "link": "https://threejs.org" } ] }, { "title": "编译&构建&打包", "items": [ { "icon": "https://www.webpackjs.com/icon_180x180.png", "title": "Webpack 中文网", "desc": "一个用于现代 JavaScript 应用程序的静态模块打包工具", "link": "https://www.webpackjs.com" }, { "icon": "https://cn.vitejs.dev/logo.svg", "title": "Vite 中文文档", "desc": "下一代前端工具链", "link": "https://cn.vitejs.dev" }, { "icon": "https://www.rollupjs.com/img/favicon.png", "title": "Rollup", "desc": "Rollup 是一个 JavaScript 模块打包器", "link": "https://www.rollupjs.com" }, { "icon": "https://turbo.build/images/favicon-dark/apple-touch-icon.png", "title": "Turbo", "desc": "Turbo is an incremental bundler and build system optimized for JavaScript and TypeScript, written in Rust", "link": "https://turbo.build" }, { "icon": "https://www.babeljs.cn/img/favicon.png", "title": "Babel", "desc": "Babel 是一个 JavaScript 编译器", "link": "https://www.babeljs.cn" }, { "icon": "https://esbuild.github.io/favicon.svg", "title": "esbuild", "desc": "An extremely fast bundler for the web", "link": "https://esbuild.github.io" }, { "icon": "https://swc.rs/favicon/apple-touch-icon.png", "title": "SWC", "desc": "Rust-based platform for the Web", "link": "https://swc.rs" }, { "icon": "/icons/unbuild.svg", "title": "unbuild", "desc": "📦 A unified JavaScript build system", "link": "https://github.com/unjs/unbuild" } ] }, { "title": "站点生成器", "items": [ { "icon": "https://astro.build/favicon.svg", "title": "Astro", "desc": "一个现代化的轻量级静态站点生成器", "link": "https://astro.build" }, { "icon": "https://cn.vuejs.org/logo.svg", "title": "VitePress", "desc": "由 Vite 和 Vue 驱动的静态网站生成器", "link": "https://vitepress.dev" }, { "icon": "https://cn.vuejs.org/logo.svg", "title": "VuePress", "desc": "Vue 驱动的静态网站生成器", "link": "https://vuepress.vuejs.org/zh" }, { "icon": "https://gw.alipayobjects.com/zos/bmw-prod/d3e3eb39-1cd7-4aa5-827c-877deced6b7e/lalxt4g3_w256_h256.png", "title": "dumi", "desc": "基于 Umi 为组件研发而生的静态站点框架", "link": "https://d.umijs.org" }, { "icon": "https://docusaurus.io/zh-CN/img/docusaurus.ico", "title": "Docusaurus", "desc": "基于 React 的静态网站生成器", "link": "https://docusaurus.io/zh-CN" } ] }, { "title": "图标库", "items": [ { "icon": "https://img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg", "title": "iconfont", "desc": "国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能", "link": "https://www.iconfont.cn" }, { "icon": "https://lf1-cdn2-tos.bytegoofy.com/bydesign/iconparksite/logo.svg", "title": "IconPark 图标库", "desc": "IconPark图标库是一个通过技术驱动矢量图标样式的开源图标库,可以实现根据单一 SVG 源文件变换出多种主题, 具备丰富的分类、更轻量的代码和更灵活的使用场景;致力于构建高质量、统一化、可定义的图标资源,让大多数人都能够选择适合自己的风格图标", "link": "https://iconpark.oceanengine.com/official" }, { "icon": "https://emoji.muan.co/appicon.png", "title": "Emoji searcher", "desc": "Emoji 表情大全", "link": "" } ] }, { "title": "社区", "items": [ { "title": "Github", "icon": { "svg": "<svg role=\"img\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><title>GitHub</title><path d=\"M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12\"/></svg>" }, "desc": "一个面向开源及私有软件项目的托管平台", "link": "https://github.com" }, { "icon": "https://cdn.sstatic.net/Sites/stackoverflow/Img/apple-touch-icon.png", "title": "Stack Overflow", "desc": "全球最大的技术问答网站", "link": "https://stackoverflow.com" }, { "title": "稀土掘金", "icon": "https://lf3-cdn-tos.bytescm.com/obj/static/xitu_juejin_web//static/favicons/apple-touch-icon.png", "desc": "面向全球中文开发者的技术内容分享与交流平台", "link": "https://juejin.cn" }, { "title": "V2EX", "icon": "https://www.v2ex.com/static/icon-192.png", "desc": "一个关于分享和探索的地方", "link": "https://www.v2ex.com" }, { "title": "SegmentFault 思否", "icon": "https://static.segmentfault.com/main_site_next/0dc4bace/touch-icon.png", "desc": "技术问答开发者社区", "link": "https://segmentfault.com" }, { "title": "博客园", "icon": "/icons/cnblogs.svg", "desc": "博客园是一个面向开发者的知识分享社区", "link": "https://www.cnblogs.com" }, { "title": "知乎", "icon": "https://static.zhihu.com/heifetz/assets/apple-touch-icon-60.362a8eac.png", "desc": "中文互联网高质量的问答社区和创作者聚集的原创内容平台", "link": "https://juejin.cn" } ] } ] }, "title": "我的导航", "date": "2025-08-25 14:23:00", "capture": "欢迎访问网站导航页面!\n\n*导航页面功能已启用*" }, { "url": "/Examples/api-examples.html", "relativePath": "/Examples/api-examples.html", "frontmatter": { "outline": "deep" }, "title": "Runtime API Examples", "date": "2025-08-25 14:23:00", "capture": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.\nThe main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:\n```md\n<script setup\nimport { useData } from 'vitepress'\ncon" }, { "url": "/Examples/", "relativePath": "/Examples/", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" }, "title": "Examples", "date": "2025-08-25 14:23:00", "capture": "这里建立vitepress时的示例文档。" }, { "url": "/Examples/markdown-examples.html", "relativePath": "/Examples/markdown-examples.html", "frontmatter": {}, "title": "Markdown Extension Examples", "date": "2025-08-25 14:23:00", "capture": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highlighting\nVitePress provides Syntax Highlighting powered by Shiki, with additional features like line-highlighting:\nInput\n````md\n```js{4}\nexport default {\n data () {\n return {\n msg: 'Highlighte" }, { "url": "/", "relativePath": "/", "frontmatter": { "layout": "home", "hero": { "name": "", "text": "Instruction Manual.", "tagline": "My great project tagline", "actions": [ { "theme": "brand", "text": "开发", "link": "/sdoc/01-开发/" }, { "theme": "alt", "text": "组件", "link": "/sdoc/02-组件/" } ], "image": { "src": "/images/blog.svg", "alt": "VitePress" } }, "features": [ { "icon": "📋", "title": "VitePress", "details": "由 Vite 和 Vue 驱动的静态站点生成器", "link": "https://vitejs.cn/vitepress/" }, { "icon": "📋", "title": "苏木", "details": "苏木的学习笔记", "link": "https://sumumm.github.io/" }, { "icon": "📝", "title": "site-hexo", "details": "苏木的hexo site", "link": "https://docs-site.github.io/site-hexo/" } ] }, "title": "", "date": "2025-08-25 14:23:00", "capture": "" }, { "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "relativePath": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "excerpt": "", "capture": "一、工作区\n\npnpm 内置了对单一存储库(也称为多包存储库、多项目存储库或整体存储库)的支持。你可以创建一个工作区来将多个项目联合到一个存储库中。\n> 工作区的根目录中必须有一个 `pnpm-workspace.yaml` 文件。\n 1. 工作区协议\n如果 linkWorkspacePackages 设置为 `true`,如果可用包与声明的范围匹配,pnpm 将从工作区链接包。例如,如果 `bar` 在其依赖中有 `\"foo\": \"^1.0.0\"` 并且 `foo@1.0.0` 在工作区中,则 `foo@1.0.0` 链接到 `bar`。但是,如果 `bar` 在依赖中有 `\"foo\"" }, { "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "relativePath": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "excerpt": "", "capture": "一、Typescript路径映射\nTypescript 路径映射(Path Mapping)是一种允许开发者在导入模块时使用自定义路径别名而不是相对路径的功能。这使得代码更加清晰、易于维护,并且在重构项目结构时更加方便。\n 1. 基本概念\n路径映射通过在 `tsconfig.json` 文件中配置 `paths` 和 `baseUrl` 来实现。`baseUrl` 指定了非相对路径模块的基础目录,`paths` 则定义了路径别名与实际路径之间的映射关系。\n路径映射的核心价值在于解决深层嵌套目录结构中的导入问题。当项目变得复杂时,相对路径可能会变成类似 `../../../../utils/he" }, { "url": "/sdoc/01-开发/LV03-主题入口分析.html", "relativePath": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "capture": "一、开发指南\n主题的主入口文件为`packages/mist/index.ts`,这里的index.ts将会在vitepress站点的`.vitepress/theme/index.ts`中导入和调用。\n 二、Workspace 机制详解\n 1. 项目配置分析\n 1.1 pnpm-workspace.yaml\n```yaml\n pnpm-workspace.yaml\npackages:\n - docs\n - packages/*\n```\n这个配置定义了 Workspace 的范围,包含了 `packages` 目录下的所有子目录。\n 1.2 packages/mist/package.js" }, { "url": "/sdoc/01-开发/LV04-主题配置.html", "relativePath": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "excerpt": "<p>vitepress的配置合并。</p>\n", "capture": "vitepress的配置合并。\n 一、概述\n当建立一个vitepress站点后,得到的默认配置文件如下:\n```typescript\nimport { defineConfig } from 'vitepress'\n// https://vitepress.dev/reference/site-config\nexport default defineConfig({\n title: \"mist docs\",\n description: \"vitepress-theme-mist docs\",\n themeConfig: {\n // https://vitepress.dev/ref" }, { "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "relativePath": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "capture": "DataLoader 组件导入过程分析\n 概述\n本文档详细分析了 DataLoader 组件在项目中的目录结构、各文件作用以及从组件实现到最终在 `@docs-site/vitepress-theme-mist` 主题中注册的完整导入链路。\n 1. 目录结构分析\n 1.1 目录结构\n```bash\n📁 DataLoader/\n├── 📄 index.ts 组件主入口文件\n├── 📁 src/\n│ ├── 📄 DataLoader.vue 组件实现文件\n│ ├── 📄 DataLoader.ts 类型定" }, { "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "relativePath": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "capture": "SCSS变量未展开问题分析\n 一、问题描述\n在 `packages\\theme-chalk\\src\\var\\theme-color.scss` 文件中,第46-51行的代码:\n```scss\nhtml[theme-color=\"ep-blue\"] {\n --vp-c-brand-1: {getCssVar(\"el-color-primary\")};\n --vp-c-brand-2: {getCssVar(\"el-color-primary-light-3\")};\n --vp-c-brand-3: {getCssVar(\"el-color-primary-light-5\")};\n --v" }, { "url": "/sdoc/01-开发/LV07-Vite插件.html", "relativePath": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "capture": "VitePress 处于 Vite 环境下,因此天然支持 Vite 插件。\n 一、Vite 插件基础模板\n首先介绍 Vite 插件的基础模板:\n```ts\nimport type { Plugin } from \"vite\";\ninterface Options {\n // ...\n}\nexport default function VitePluginVitePressTemplate(option: Options = {}): Plugin {\n return {\n name: \"vite-plugin-vitepress-template\",\n // ...\n };\n" }, { "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "relativePath": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {}, "title": "Git 提交规范与工具集成", "date": "2025-08-25 14:23:00", "capture": "在现代前端开发中,规范化的 Git 提交信息对于项目维护和版本管理至关重要。本文将详细介绍 husky、cz-git 和 @commitlint/cli 三个工具的使用方法,以及如何建立一套完整的 Git 提交规范体系。\n\n 一、Husky - Git 钩子工具\n 1. 简介\nHusky 是一个现代化的 Git 钩子管理工具,它允许我们在 Git 的各个生命周期节点(如 pre-commit、commit-msg 等)执行自定义脚本。通过 Husky,我们可以自动化执行代码检查、测试、提交信息验证等任务。\n> Git仓库:GitHub - typicode/husky: Git hook" }, { "url": "/sdoc/01-开发/", "relativePath": "/sdoc/01-开发/", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" }, "title": "开发", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "excerpt": "", "capture": "<script setup\nimport { MtDataLoader } from \"vitepress-theme-mist\"\n</script>\n 简介\n第一个组件,主要是学习组件的写法和用法。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtDataLoader />\n```\n 效果\n<MtDataLoader />" }, { "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "excerpt": "", "capture": "简介\n这是一个回到顶部按钮。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtBackTop minScrollY=\"value\"/\n```\nminScrollY表示向下滚动多少px后出现回到顶部按钮。\n 效果\n页面向下滚动就可以看到右下角出现轨道顶部按钮了。\n<MtBackTop minScrollY=\"20\"/>" }, { "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" }, "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "excerpt": "", "capture": "<script setup\nimport { MtTransitionCollapse } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst show = ref(false)\n</script>\n<style scoped>\n.preview-container {\n padding: 20px;\n border: 1px solid ddd;\n border-radius: 4px;\n}\n.content {\n padding: 10px;\n background-color:rg" }, { "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" }, "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "excerpt": "", "capture": "<script setup\nimport { MtInputSlide } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst value1 = ref(50) // 基础示例\nconst value2 = ref(100) // 自定义范围示例\nconst value3 = ref(5) // 设置步长示例\nconst value4 = ref(30) // 禁用状态示例\nconst value5 = ref(75) // 自定义格式化示例\nconst formatPercentage = (val) =&g" }, { "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "capture": "<!-- 引入 iconfont 在线图标样式 --\n<link rel=\"stylesheet\" href=\"//at.alicdn.com/t/font_2989306_w303erbip9.css\" />\n<script setup lang=\"ts\">\nimport { MtIcon } from \"vitepress-theme-mist\";\nimport { gitee, email, WhatsApp, telegram, github, bilibili, moblieQQ, music } from \"vitepress-theme-mist\";" }, { "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" }, "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "excerpt": "", "capture": "<script setup\nimport { MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 基础示例\nconst basicClickCount = ref(0)\nconst handleBasicClick = () => {\n basicClickCount.value++\n}\n// 不同类型示例\nconst primaryClickCount = ref(0)\nconst handlePrimaryClick = () => {\n primaryClickCount.value" }, { "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" }, "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "excerpt": "", "capture": "<script setup\nimport { MtMessage } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst showMessage = (type = 'info') => {\n MtMessagetype\n}\nconst showCustomMessage = () => {\n MtMessage({\n message: '这是一条自定义消息,持续5秒',\n type: 'success',\n duration: 5000,\n showClose: true,\n " }, { "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" }, "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "excerpt": "", "capture": "<script setup\nimport { MtPopover, MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 不同触发方式示例\nconst clickVisible = ref(false)\nconst hoverVisible = ref(false)\nconst focusVisible = ref(false)\n// 不同位置示例\nconst topVisible = ref(false)\nconst rightVisible = ref(false)\nconst bottomVisibl" }, { "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" }, "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "excerpt": "", "capture": "<script setup\nimport { MtSegmented, MtSegmentedItem } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst basicValue = ref('option1')\nconst disabledValue = ref('option1')\nconst iconValue = ref(\"ep:coordinate\")\nconst mixedValue = ref('option1')\nconst numberValue = ref(1)\nconst basicOptions" }, { "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "excerpt": "<p>这一部分来了解一下ArticlePage文章页组件。</p>\n", "capture": "这一部分来了解一下ArticlePage文章页组件。\n<script setup\nimport { MtArticlePage } from \"vitepress-theme-mist\"\n</script>\n 一、page布局\n当在 Markdown 文档将 `frontmatter.layout` 设置为 `page`,VitePress 不会对该 Markdown 生成的文章页应用任何样式,这对于需要创建一个完全自定义的页面时很有用。当没有设置`frontmatter.layout`时,默认使用的是`doc`布局,是这样的:\n当改为page布局,会变成这样:\n 二、文章页" }, { "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下Breadcrumb面包屑组件。</p>\n", "capture": "这一部分来了解一下Breadcrumb面包屑组件。\n<script setup\nimport { MtBreadcrumb, MtBreadcrumbItem } from \"vitepress-theme-mist\"\n</script>\n 一、组件介绍\nBreadcrumb(面包屑)是一种导航组件,用于显示用户在网站或应用中的当前位置。它可以帮助用户理解他们所在的层级结构,并提供快速返回上一级或首页的导航路径。\n 特点\n- 简洁直观:清晰的层级结构展示\n- 高度可定制:支持自定义分隔符\n- 灵活使用:支持纯文本、图标、链接等多种内容形式\n- 无障碍支持:内置ARIA属性,提" }, { "url": "/sdoc/02-组件/01-公共组件/", "relativePath": "/sdoc/02-组件/01-公共组件/", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" }, "title": "公共组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有公共组件的使用文档。" }, { "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "capture": "Demo 插件与 MtDemoCode 组件分析\n 一、概述\n本文档深入分析 VitePress 主题中的 `demo` 插件 (`packages/markdown/plugins/demo.ts`) 和 `MtDemoCode` 组件 (`packages/components/theme/DemoCode/src/index.vue`)。这两个组件协同工作,实现在 Markdown 文档中嵌入可交互的 Vue 组件示例,并提供源代码查看、复制等功能。\n 二、工作原理总览\n整个流程可以分为以下几个步骤:\n(1)Markdown 解析阶段:VitePress 使用 `demo` 插件解析 M" }, { "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleBreadcrumb文章面包屑组件。</p>\n", "capture": "这一部分来了解一下ArticleBreadcrumb文章面包屑组件。\n<script setup\nimport { MtArticleBreadcrumb } from \"@mist/components/theme/ArticleBreadcrumb\"\n</script>\n 一、组件介绍\nArticleBreadcrumb(文章面包屑)是一个为文章页面设计的面包屑组件,它会根据当前页面的路径自动生成面包屑导航。该组件是基于基础的 Breadcrumb 组件构建的,但针对文章页面进行了优化。\n 二、基础用法\n 1. 默认用法\n在文章页面中直接使用 ArticleBreadcr" }, { "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleInfo文章信息组件。</p>\n", "capture": "这一部分来了解一下ArticleInfo文章信息组件。\n<script setup\nimport { MtArticleInfo } from \"@mist/components/theme/ArticleInfo\"\n</script>\n 一、组件介绍\nArticleInfo(文章信息)是一个用于显示文章基本信息的组件,包括作者、创建时间、更新时间、分类、标签等内容。该组件会根据主题配置自动显示相应的信息,并支持在首页和文章页的不同展示需求。\n 二、基础用法\n 1. 默认用法\n在文章页面中使用 ArticleInfo 组件,传入文章数据和作用域:\nArticleInfo/ba" }, { "url": "/sdoc/02-组件/02-主题组件/", "relativePath": "/sdoc/02-组件/02-主题组件/", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" }, "title": "主题组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有主题组件的使用文档。" }, { "url": "/sdoc/02-组件/", "relativePath": "/sdoc/02-组件/", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" }, "title": "组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有组件的使用文档。" }, { "url": "/sdoc/03-插件/LV01-file-content-loader.html", "relativePath": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {}, "title": "vitepress-plugin-file-content-loader", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-file-content-loader` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描和处理指定的文件内容。该插件将 VitePress 官方的构建时数据加载功能封装成独立的插件形式,使开发者能够更便捷地获取和处理项目中的 Markdown 文件内容。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 文件内容扫描与处理\n- 在 VitePress 启动时扫描项目中指定的文件(默认为 Markdown 文档)\n- 解析文件的 frontmatter" }, { "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "relativePath": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {}, "title": "vitepress-plugin-catalogue 插件深度解析", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-catalogue` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描 Markdown 文档并生成目录信息。该插件能够自动识别标记为目录页的文档,并为其生成结构化的目录数据,便于开发者创建美观实用的目录页面。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 目录数据自动生成\n- 在 VitePress 启动时扫描项目中的 Markdown 文档\n- 识别具有 `catalogue: true` 和 `path` 属性的文档作为目录页\n- 根据指定路" }, { "url": "/sdoc/03-插件/", "relativePath": "/sdoc/03-插件/", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" }, "title": "插件", "date": "2025-08-25 14:23:00", "capture": "这里一些插件文档。" }, { "url": "/sdoc/", "relativePath": "/sdoc/", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" }, "title": "我的文档", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/test/articlePage/aside.html", "relativePath": "/test/articlePage/aside.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc aside class=\"demo-article-page-aside\">\n <h1 id=\"一级标题\">\n 一级标题\n <a class=\"header-anchor\" href=\"一级标题\" aria-label=\"Permalink to '一级标题'\" />\n </h1>\n <h2 i" }, { "url": "/test/articlePage/doc.html", "relativePath": "/test/articlePage/doc.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc class=\"demo-article-page-doc\">\n <h1>使用doc配置项的MtArticlePage</h1>\n <h2>二级标题</h2>\n <p>content a</p>\n <h3>三级标题</h3>\n <p>con" } ], "originPosts": [ { "url": "/Examples/api-examples.html", "relativePath": "/Examples/api-examples.html", "frontmatter": { "outline": "deep" }, "title": "Runtime API Examples", "date": "2025-08-25 14:23:00", "capture": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.\nThe main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:\n```md\n<script setup\nimport { useData } from 'vitepress'\ncon" }, { "url": "/Examples/", "relativePath": "/Examples/", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" }, "title": "Examples", "date": "2025-08-25 14:23:00", "capture": "这里建立vitepress时的示例文档。" }, { "url": "/Examples/markdown-examples.html", "relativePath": "/Examples/markdown-examples.html", "frontmatter": {}, "title": "Markdown Extension Examples", "date": "2025-08-25 14:23:00", "capture": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highlighting\nVitePress provides Syntax Highlighting powered by Shiki, with additional features like line-highlighting:\nInput\n````md\n```js{4}\nexport default {\n data () {\n return {\n msg: 'Highlighte" }, { "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "relativePath": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "excerpt": "", "capture": "一、工作区\n\npnpm 内置了对单一存储库(也称为多包存储库、多项目存储库或整体存储库)的支持。你可以创建一个工作区来将多个项目联合到一个存储库中。\n> 工作区的根目录中必须有一个 `pnpm-workspace.yaml` 文件。\n 1. 工作区协议\n如果 linkWorkspacePackages 设置为 `true`,如果可用包与声明的范围匹配,pnpm 将从工作区链接包。例如,如果 `bar` 在其依赖中有 `\"foo\": \"^1.0.0\"` 并且 `foo@1.0.0` 在工作区中,则 `foo@1.0.0` 链接到 `bar`。但是,如果 `bar` 在依赖中有 `\"foo\"" }, { "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "relativePath": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "excerpt": "", "capture": "一、Typescript路径映射\nTypescript 路径映射(Path Mapping)是一种允许开发者在导入模块时使用自定义路径别名而不是相对路径的功能。这使得代码更加清晰、易于维护,并且在重构项目结构时更加方便。\n 1. 基本概念\n路径映射通过在 `tsconfig.json` 文件中配置 `paths` 和 `baseUrl` 来实现。`baseUrl` 指定了非相对路径模块的基础目录,`paths` 则定义了路径别名与实际路径之间的映射关系。\n路径映射的核心价值在于解决深层嵌套目录结构中的导入问题。当项目变得复杂时,相对路径可能会变成类似 `../../../../utils/he" }, { "url": "/sdoc/01-开发/LV03-主题入口分析.html", "relativePath": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "capture": "一、开发指南\n主题的主入口文件为`packages/mist/index.ts`,这里的index.ts将会在vitepress站点的`.vitepress/theme/index.ts`中导入和调用。\n 二、Workspace 机制详解\n 1. 项目配置分析\n 1.1 pnpm-workspace.yaml\n```yaml\n pnpm-workspace.yaml\npackages:\n - docs\n - packages/*\n```\n这个配置定义了 Workspace 的范围,包含了 `packages` 目录下的所有子目录。\n 1.2 packages/mist/package.js" }, { "url": "/sdoc/01-开发/LV04-主题配置.html", "relativePath": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "excerpt": "<p>vitepress的配置合并。</p>\n", "capture": "vitepress的配置合并。\n 一、概述\n当建立一个vitepress站点后,得到的默认配置文件如下:\n```typescript\nimport { defineConfig } from 'vitepress'\n// https://vitepress.dev/reference/site-config\nexport default defineConfig({\n title: \"mist docs\",\n description: \"vitepress-theme-mist docs\",\n themeConfig: {\n // https://vitepress.dev/ref" }, { "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "relativePath": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "capture": "DataLoader 组件导入过程分析\n 概述\n本文档详细分析了 DataLoader 组件在项目中的目录结构、各文件作用以及从组件实现到最终在 `@docs-site/vitepress-theme-mist` 主题中注册的完整导入链路。\n 1. 目录结构分析\n 1.1 目录结构\n```bash\n📁 DataLoader/\n├── 📄 index.ts 组件主入口文件\n├── 📁 src/\n│ ├── 📄 DataLoader.vue 组件实现文件\n│ ├── 📄 DataLoader.ts 类型定" }, { "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "relativePath": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "capture": "SCSS变量未展开问题分析\n 一、问题描述\n在 `packages\\theme-chalk\\src\\var\\theme-color.scss` 文件中,第46-51行的代码:\n```scss\nhtml[theme-color=\"ep-blue\"] {\n --vp-c-brand-1: {getCssVar(\"el-color-primary\")};\n --vp-c-brand-2: {getCssVar(\"el-color-primary-light-3\")};\n --vp-c-brand-3: {getCssVar(\"el-color-primary-light-5\")};\n --v" }, { "url": "/sdoc/01-开发/LV07-Vite插件.html", "relativePath": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "capture": "VitePress 处于 Vite 环境下,因此天然支持 Vite 插件。\n 一、Vite 插件基础模板\n首先介绍 Vite 插件的基础模板:\n```ts\nimport type { Plugin } from \"vite\";\ninterface Options {\n // ...\n}\nexport default function VitePluginVitePressTemplate(option: Options = {}): Plugin {\n return {\n name: \"vite-plugin-vitepress-template\",\n // ...\n };\n" }, { "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "relativePath": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {}, "title": "Git 提交规范与工具集成", "date": "2025-08-25 14:23:00", "capture": "在现代前端开发中,规范化的 Git 提交信息对于项目维护和版本管理至关重要。本文将详细介绍 husky、cz-git 和 @commitlint/cli 三个工具的使用方法,以及如何建立一套完整的 Git 提交规范体系。\n\n 一、Husky - Git 钩子工具\n 1. 简介\nHusky 是一个现代化的 Git 钩子管理工具,它允许我们在 Git 的各个生命周期节点(如 pre-commit、commit-msg 等)执行自定义脚本。通过 Husky,我们可以自动化执行代码检查、测试、提交信息验证等任务。\n> Git仓库:GitHub - typicode/husky: Git hook" }, { "url": "/sdoc/01-开发/", "relativePath": "/sdoc/01-开发/", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" }, "title": "开发", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "excerpt": "", "capture": "<script setup\nimport { MtDataLoader } from \"vitepress-theme-mist\"\n</script>\n 简介\n第一个组件,主要是学习组件的写法和用法。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtDataLoader />\n```\n 效果\n<MtDataLoader />" }, { "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "excerpt": "", "capture": "简介\n这是一个回到顶部按钮。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtBackTop minScrollY=\"value\"/\n```\nminScrollY表示向下滚动多少px后出现回到顶部按钮。\n 效果\n页面向下滚动就可以看到右下角出现轨道顶部按钮了。\n<MtBackTop minScrollY=\"20\"/>" }, { "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" }, "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "excerpt": "", "capture": "<script setup\nimport { MtTransitionCollapse } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst show = ref(false)\n</script>\n<style scoped>\n.preview-container {\n padding: 20px;\n border: 1px solid ddd;\n border-radius: 4px;\n}\n.content {\n padding: 10px;\n background-color:rg" }, { "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" }, "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "excerpt": "", "capture": "<script setup\nimport { MtInputSlide } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst value1 = ref(50) // 基础示例\nconst value2 = ref(100) // 自定义范围示例\nconst value3 = ref(5) // 设置步长示例\nconst value4 = ref(30) // 禁用状态示例\nconst value5 = ref(75) // 自定义格式化示例\nconst formatPercentage = (val) =&g" }, { "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "capture": "<!-- 引入 iconfont 在线图标样式 --\n<link rel=\"stylesheet\" href=\"//at.alicdn.com/t/font_2989306_w303erbip9.css\" />\n<script setup lang=\"ts\">\nimport { MtIcon } from \"vitepress-theme-mist\";\nimport { gitee, email, WhatsApp, telegram, github, bilibili, moblieQQ, music } from \"vitepress-theme-mist\";" }, { "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" }, "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "excerpt": "", "capture": "<script setup\nimport { MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 基础示例\nconst basicClickCount = ref(0)\nconst handleBasicClick = () => {\n basicClickCount.value++\n}\n// 不同类型示例\nconst primaryClickCount = ref(0)\nconst handlePrimaryClick = () => {\n primaryClickCount.value" }, { "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" }, "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "excerpt": "", "capture": "<script setup\nimport { MtMessage } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst showMessage = (type = 'info') => {\n MtMessagetype\n}\nconst showCustomMessage = () => {\n MtMessage({\n message: '这是一条自定义消息,持续5秒',\n type: 'success',\n duration: 5000,\n showClose: true,\n " }, { "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" }, "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "excerpt": "", "capture": "<script setup\nimport { MtPopover, MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 不同触发方式示例\nconst clickVisible = ref(false)\nconst hoverVisible = ref(false)\nconst focusVisible = ref(false)\n// 不同位置示例\nconst topVisible = ref(false)\nconst rightVisible = ref(false)\nconst bottomVisibl" }, { "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" }, "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "excerpt": "", "capture": "<script setup\nimport { MtSegmented, MtSegmentedItem } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst basicValue = ref('option1')\nconst disabledValue = ref('option1')\nconst iconValue = ref(\"ep:coordinate\")\nconst mixedValue = ref('option1')\nconst numberValue = ref(1)\nconst basicOptions" }, { "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "excerpt": "<p>这一部分来了解一下ArticlePage文章页组件。</p>\n", "capture": "这一部分来了解一下ArticlePage文章页组件。\n<script setup\nimport { MtArticlePage } from \"vitepress-theme-mist\"\n</script>\n 一、page布局\n当在 Markdown 文档将 `frontmatter.layout` 设置为 `page`,VitePress 不会对该 Markdown 生成的文章页应用任何样式,这对于需要创建一个完全自定义的页面时很有用。当没有设置`frontmatter.layout`时,默认使用的是`doc`布局,是这样的:\n当改为page布局,会变成这样:\n 二、文章页" }, { "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下Breadcrumb面包屑组件。</p>\n", "capture": "这一部分来了解一下Breadcrumb面包屑组件。\n<script setup\nimport { MtBreadcrumb, MtBreadcrumbItem } from \"vitepress-theme-mist\"\n</script>\n 一、组件介绍\nBreadcrumb(面包屑)是一种导航组件,用于显示用户在网站或应用中的当前位置。它可以帮助用户理解他们所在的层级结构,并提供快速返回上一级或首页的导航路径。\n 特点\n- 简洁直观:清晰的层级结构展示\n- 高度可定制:支持自定义分隔符\n- 灵活使用:支持纯文本、图标、链接等多种内容形式\n- 无障碍支持:内置ARIA属性,提" }, { "url": "/sdoc/02-组件/01-公共组件/", "relativePath": "/sdoc/02-组件/01-公共组件/", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" }, "title": "公共组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有公共组件的使用文档。" }, { "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "capture": "Demo 插件与 MtDemoCode 组件分析\n 一、概述\n本文档深入分析 VitePress 主题中的 `demo` 插件 (`packages/markdown/plugins/demo.ts`) 和 `MtDemoCode` 组件 (`packages/components/theme/DemoCode/src/index.vue`)。这两个组件协同工作,实现在 Markdown 文档中嵌入可交互的 Vue 组件示例,并提供源代码查看、复制等功能。\n 二、工作原理总览\n整个流程可以分为以下几个步骤:\n(1)Markdown 解析阶段:VitePress 使用 `demo` 插件解析 M" }, { "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleBreadcrumb文章面包屑组件。</p>\n", "capture": "这一部分来了解一下ArticleBreadcrumb文章面包屑组件。\n<script setup\nimport { MtArticleBreadcrumb } from \"@mist/components/theme/ArticleBreadcrumb\"\n</script>\n 一、组件介绍\nArticleBreadcrumb(文章面包屑)是一个为文章页面设计的面包屑组件,它会根据当前页面的路径自动生成面包屑导航。该组件是基于基础的 Breadcrumb 组件构建的,但针对文章页面进行了优化。\n 二、基础用法\n 1. 默认用法\n在文章页面中直接使用 ArticleBreadcr" }, { "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleInfo文章信息组件。</p>\n", "capture": "这一部分来了解一下ArticleInfo文章信息组件。\n<script setup\nimport { MtArticleInfo } from \"@mist/components/theme/ArticleInfo\"\n</script>\n 一、组件介绍\nArticleInfo(文章信息)是一个用于显示文章基本信息的组件,包括作者、创建时间、更新时间、分类、标签等内容。该组件会根据主题配置自动显示相应的信息,并支持在首页和文章页的不同展示需求。\n 二、基础用法\n 1. 默认用法\n在文章页面中使用 ArticleInfo 组件,传入文章数据和作用域:\nArticleInfo/ba" }, { "url": "/sdoc/02-组件/02-主题组件/", "relativePath": "/sdoc/02-组件/02-主题组件/", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" }, "title": "主题组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有主题组件的使用文档。" }, { "url": "/sdoc/02-组件/", "relativePath": "/sdoc/02-组件/", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" }, "title": "组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有组件的使用文档。" }, { "url": "/sdoc/03-插件/LV01-file-content-loader.html", "relativePath": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {}, "title": "vitepress-plugin-file-content-loader", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-file-content-loader` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描和处理指定的文件内容。该插件将 VitePress 官方的构建时数据加载功能封装成独立的插件形式,使开发者能够更便捷地获取和处理项目中的 Markdown 文件内容。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 文件内容扫描与处理\n- 在 VitePress 启动时扫描项目中指定的文件(默认为 Markdown 文档)\n- 解析文件的 frontmatter" }, { "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "relativePath": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {}, "title": "vitepress-plugin-catalogue 插件深度解析", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-catalogue` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描 Markdown 文档并生成目录信息。该插件能够自动识别标记为目录页的文档,并为其生成结构化的目录数据,便于开发者创建美观实用的目录页面。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 目录数据自动生成\n- 在 VitePress 启动时扫描项目中的 Markdown 文档\n- 识别具有 `catalogue: true` 和 `path` 属性的文档作为目录页\n- 根据指定路" }, { "url": "/sdoc/03-插件/", "relativePath": "/sdoc/03-插件/", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" }, "title": "插件", "date": "2025-08-25 14:23:00", "capture": "这里一些插件文档。" }, { "url": "/sdoc/", "relativePath": "/sdoc/", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" }, "title": "我的文档", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/test/articlePage/aside.html", "relativePath": "/test/articlePage/aside.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc aside class=\"demo-article-page-aside\">\n <h1 id=\"一级标题\">\n 一级标题\n <a class=\"header-anchor\" href=\"一级标题\" aria-label=\"Permalink to '一级标题'\" />\n </h1>\n <h2 i" }, { "url": "/test/articlePage/doc.html", "relativePath": "/test/articlePage/doc.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc class=\"demo-article-page-doc\">\n <h1>使用doc配置项的MtArticlePage</h1>\n <h2>二级标题</h2>\n <p>content a</p>\n <h3>三级标题</h3>\n <p>con" } ], "sortPostsByDateAndSticky": [ { "url": "/Examples/api-examples.html", "relativePath": "/Examples/api-examples.html", "frontmatter": { "outline": "deep" }, "title": "Runtime API Examples", "date": "2025-08-25 14:23:00", "capture": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.\nThe main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:\n```md\n<script setup\nimport { useData } from 'vitepress'\ncon" }, { "url": "/Examples/", "relativePath": "/Examples/", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" }, "title": "Examples", "date": "2025-08-25 14:23:00", "capture": "这里建立vitepress时的示例文档。" }, { "url": "/Examples/markdown-examples.html", "relativePath": "/Examples/markdown-examples.html", "frontmatter": {}, "title": "Markdown Extension Examples", "date": "2025-08-25 14:23:00", "capture": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highlighting\nVitePress provides Syntax Highlighting powered by Shiki, with additional features like line-highlighting:\nInput\n````md\n```js{4}\nexport default {\n data () {\n return {\n msg: 'Highlighte" }, { "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "relativePath": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {}, "title": "Git 提交规范与工具集成", "date": "2025-08-25 14:23:00", "capture": "在现代前端开发中,规范化的 Git 提交信息对于项目维护和版本管理至关重要。本文将详细介绍 husky、cz-git 和 @commitlint/cli 三个工具的使用方法,以及如何建立一套完整的 Git 提交规范体系。\n\n 一、Husky - Git 钩子工具\n 1. 简介\nHusky 是一个现代化的 Git 钩子管理工具,它允许我们在 Git 的各个生命周期节点(如 pre-commit、commit-msg 等)执行自定义脚本。通过 Husky,我们可以自动化执行代码检查、测试、提交信息验证等任务。\n> Git仓库:GitHub - typicode/husky: Git hook" }, { "url": "/sdoc/01-开发/", "relativePath": "/sdoc/01-开发/", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" }, "title": "开发", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/sdoc/02-组件/01-公共组件/", "relativePath": "/sdoc/02-组件/01-公共组件/", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" }, "title": "公共组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有公共组件的使用文档。" }, { "url": "/sdoc/02-组件/02-主题组件/", "relativePath": "/sdoc/02-组件/02-主题组件/", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" }, "title": "主题组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有主题组件的使用文档。" }, { "url": "/sdoc/02-组件/", "relativePath": "/sdoc/02-组件/", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" }, "title": "组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有组件的使用文档。" }, { "url": "/sdoc/03-插件/LV01-file-content-loader.html", "relativePath": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {}, "title": "vitepress-plugin-file-content-loader", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-file-content-loader` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描和处理指定的文件内容。该插件将 VitePress 官方的构建时数据加载功能封装成独立的插件形式,使开发者能够更便捷地获取和处理项目中的 Markdown 文件内容。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 文件内容扫描与处理\n- 在 VitePress 启动时扫描项目中指定的文件(默认为 Markdown 文档)\n- 解析文件的 frontmatter" }, { "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "relativePath": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {}, "title": "vitepress-plugin-catalogue 插件深度解析", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-catalogue` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描 Markdown 文档并生成目录信息。该插件能够自动识别标记为目录页的文档,并为其生成结构化的目录数据,便于开发者创建美观实用的目录页面。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 目录数据自动生成\n- 在 VitePress 启动时扫描项目中的 Markdown 文档\n- 识别具有 `catalogue: true` 和 `path` 属性的文档作为目录页\n- 根据指定路" }, { "url": "/sdoc/03-插件/", "relativePath": "/sdoc/03-插件/", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" }, "title": "插件", "date": "2025-08-25 14:23:00", "capture": "这里一些插件文档。" }, { "url": "/sdoc/", "relativePath": "/sdoc/", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" }, "title": "我的文档", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/test/articlePage/aside.html", "relativePath": "/test/articlePage/aside.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc aside class=\"demo-article-page-aside\">\n <h1 id=\"一级标题\">\n 一级标题\n <a class=\"header-anchor\" href=\"一级标题\" aria-label=\"Permalink to '一级标题'\" />\n </h1>\n <h2 i" }, { "url": "/test/articlePage/doc.html", "relativePath": "/test/articlePage/doc.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc class=\"demo-article-page-doc\">\n <h1>使用doc配置项的MtArticlePage</h1>\n <h2>二级标题</h2>\n <p>content a</p>\n <h3>三级标题</h3>\n <p>con" }, { "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下Breadcrumb面包屑组件。</p>\n", "capture": "这一部分来了解一下Breadcrumb面包屑组件。\n<script setup\nimport { MtBreadcrumb, MtBreadcrumbItem } from \"vitepress-theme-mist\"\n</script>\n 一、组件介绍\nBreadcrumb(面包屑)是一种导航组件,用于显示用户在网站或应用中的当前位置。它可以帮助用户理解他们所在的层级结构,并提供快速返回上一级或首页的导航路径。\n 特点\n- 简洁直观:清晰的层级结构展示\n- 高度可定制:支持自定义分隔符\n- 灵活使用:支持纯文本、图标、链接等多种内容形式\n- 无障碍支持:内置ARIA属性,提" }, { "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleBreadcrumb文章面包屑组件。</p>\n", "capture": "这一部分来了解一下ArticleBreadcrumb文章面包屑组件。\n<script setup\nimport { MtArticleBreadcrumb } from \"@mist/components/theme/ArticleBreadcrumb\"\n</script>\n 一、组件介绍\nArticleBreadcrumb(文章面包屑)是一个为文章页面设计的面包屑组件,它会根据当前页面的路径自动生成面包屑导航。该组件是基于基础的 Breadcrumb 组件构建的,但针对文章页面进行了优化。\n 二、基础用法\n 1. 默认用法\n在文章页面中直接使用 ArticleBreadcr" }, { "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleInfo文章信息组件。</p>\n", "capture": "这一部分来了解一下ArticleInfo文章信息组件。\n<script setup\nimport { MtArticleInfo } from \"@mist/components/theme/ArticleInfo\"\n</script>\n 一、组件介绍\nArticleInfo(文章信息)是一个用于显示文章基本信息的组件,包括作者、创建时间、更新时间、分类、标签等内容。该组件会根据主题配置自动显示相应的信息,并支持在首页和文章页的不同展示需求。\n 二、基础用法\n 1. 默认用法\n在文章页面中使用 ArticleInfo 组件,传入文章数据和作用域:\nArticleInfo/ba" }, { "url": "/sdoc/01-开发/LV07-Vite插件.html", "relativePath": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "capture": "VitePress 处于 Vite 环境下,因此天然支持 Vite 插件。\n 一、Vite 插件基础模板\n首先介绍 Vite 插件的基础模板:\n```ts\nimport type { Plugin } from \"vite\";\ninterface Options {\n // ...\n}\nexport default function VitePluginVitePressTemplate(option: Options = {}): Plugin {\n return {\n name: \"vite-plugin-vitepress-template\",\n // ...\n };\n" }, { "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "relativePath": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "capture": "SCSS变量未展开问题分析\n 一、问题描述\n在 `packages\\theme-chalk\\src\\var\\theme-color.scss` 文件中,第46-51行的代码:\n```scss\nhtml[theme-color=\"ep-blue\"] {\n --vp-c-brand-1: {getCssVar(\"el-color-primary\")};\n --vp-c-brand-2: {getCssVar(\"el-color-primary-light-3\")};\n --vp-c-brand-3: {getCssVar(\"el-color-primary-light-5\")};\n --v" }, { "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "excerpt": "<p>这一部分来了解一下ArticlePage文章页组件。</p>\n", "capture": "这一部分来了解一下ArticlePage文章页组件。\n<script setup\nimport { MtArticlePage } from \"vitepress-theme-mist\"\n</script>\n 一、page布局\n当在 Markdown 文档将 `frontmatter.layout` 设置为 `page`,VitePress 不会对该 Markdown 生成的文章页应用任何样式,这对于需要创建一个完全自定义的页面时很有用。当没有设置`frontmatter.layout`时,默认使用的是`doc`布局,是这样的:\n当改为page布局,会变成这样:\n 二、文章页" }, { "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" }, "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "excerpt": "", "capture": "<script setup\nimport { MtSegmented, MtSegmentedItem } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst basicValue = ref('option1')\nconst disabledValue = ref('option1')\nconst iconValue = ref(\"ep:coordinate\")\nconst mixedValue = ref('option1')\nconst numberValue = ref(1)\nconst basicOptions" }, { "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" }, "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "excerpt": "", "capture": "<script setup\nimport { MtPopover, MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 不同触发方式示例\nconst clickVisible = ref(false)\nconst hoverVisible = ref(false)\nconst focusVisible = ref(false)\n// 不同位置示例\nconst topVisible = ref(false)\nconst rightVisible = ref(false)\nconst bottomVisibl" }, { "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "capture": "Demo 插件与 MtDemoCode 组件分析\n 一、概述\n本文档深入分析 VitePress 主题中的 `demo` 插件 (`packages/markdown/plugins/demo.ts`) 和 `MtDemoCode` 组件 (`packages/components/theme/DemoCode/src/index.vue`)。这两个组件协同工作,实现在 Markdown 文档中嵌入可交互的 Vue 组件示例,并提供源代码查看、复制等功能。\n 二、工作原理总览\n整个流程可以分为以下几个步骤:\n(1)Markdown 解析阶段:VitePress 使用 `demo` 插件解析 M" }, { "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" }, "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "excerpt": "", "capture": "<script setup\nimport { MtMessage } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst showMessage = (type = 'info') => {\n MtMessagetype\n}\nconst showCustomMessage = () => {\n MtMessage({\n message: '这是一条自定义消息,持续5秒',\n type: 'success',\n duration: 5000,\n showClose: true,\n " }, { "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" }, "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "excerpt": "", "capture": "<script setup\nimport { MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 基础示例\nconst basicClickCount = ref(0)\nconst handleBasicClick = () => {\n basicClickCount.value++\n}\n// 不同类型示例\nconst primaryClickCount = ref(0)\nconst handlePrimaryClick = () => {\n primaryClickCount.value" }, { "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "capture": "<!-- 引入 iconfont 在线图标样式 --\n<link rel=\"stylesheet\" href=\"//at.alicdn.com/t/font_2989306_w303erbip9.css\" />\n<script setup lang=\"ts\">\nimport { MtIcon } from \"vitepress-theme-mist\";\nimport { gitee, email, WhatsApp, telegram, github, bilibili, moblieQQ, music } from \"vitepress-theme-mist\";" }, { "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" }, "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "excerpt": "", "capture": "<script setup\nimport { MtInputSlide } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst value1 = ref(50) // 基础示例\nconst value2 = ref(100) // 自定义范围示例\nconst value3 = ref(5) // 设置步长示例\nconst value4 = ref(30) // 禁用状态示例\nconst value5 = ref(75) // 自定义格式化示例\nconst formatPercentage = (val) =&g" }, { "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" }, "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "excerpt": "", "capture": "<script setup\nimport { MtTransitionCollapse } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst show = ref(false)\n</script>\n<style scoped>\n.preview-container {\n padding: 20px;\n border: 1px solid ddd;\n border-radius: 4px;\n}\n.content {\n padding: 10px;\n background-color:rg" }, { "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "excerpt": "", "capture": "简介\n这是一个回到顶部按钮。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtBackTop minScrollY=\"value\"/\n```\nminScrollY表示向下滚动多少px后出现回到顶部按钮。\n 效果\n页面向下滚动就可以看到右下角出现轨道顶部按钮了。\n<MtBackTop minScrollY=\"20\"/>" }, { "url": "/sdoc/01-开发/LV04-主题配置.html", "relativePath": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "excerpt": "<p>vitepress的配置合并。</p>\n", "capture": "vitepress的配置合并。\n 一、概述\n当建立一个vitepress站点后,得到的默认配置文件如下:\n```typescript\nimport { defineConfig } from 'vitepress'\n// https://vitepress.dev/reference/site-config\nexport default defineConfig({\n title: \"mist docs\",\n description: \"vitepress-theme-mist docs\",\n themeConfig: {\n // https://vitepress.dev/ref" }, { "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "excerpt": "", "capture": "<script setup\nimport { MtDataLoader } from \"vitepress-theme-mist\"\n</script>\n 简介\n第一个组件,主要是学习组件的写法和用法。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtDataLoader />\n```\n 效果\n<MtDataLoader />" }, { "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "relativePath": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "capture": "DataLoader 组件导入过程分析\n 概述\n本文档详细分析了 DataLoader 组件在项目中的目录结构、各文件作用以及从组件实现到最终在 `@docs-site/vitepress-theme-mist` 主题中注册的完整导入链路。\n 1. 目录结构分析\n 1.1 目录结构\n```bash\n📁 DataLoader/\n├── 📄 index.ts 组件主入口文件\n├── 📁 src/\n│ ├── 📄 DataLoader.vue 组件实现文件\n│ ├── 📄 DataLoader.ts 类型定" }, { "url": "/sdoc/01-开发/LV03-主题入口分析.html", "relativePath": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "capture": "一、开发指南\n主题的主入口文件为`packages/mist/index.ts`,这里的index.ts将会在vitepress站点的`.vitepress/theme/index.ts`中导入和调用。\n 二、Workspace 机制详解\n 1. 项目配置分析\n 1.1 pnpm-workspace.yaml\n```yaml\n pnpm-workspace.yaml\npackages:\n - docs\n - packages/*\n```\n这个配置定义了 Workspace 的范围,包含了 `packages` 目录下的所有子目录。\n 1.2 packages/mist/package.js" }, { "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "relativePath": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "excerpt": "", "capture": "一、Typescript路径映射\nTypescript 路径映射(Path Mapping)是一种允许开发者在导入模块时使用自定义路径别名而不是相对路径的功能。这使得代码更加清晰、易于维护,并且在重构项目结构时更加方便。\n 1. 基本概念\n路径映射通过在 `tsconfig.json` 文件中配置 `paths` 和 `baseUrl` 来实现。`baseUrl` 指定了非相对路径模块的基础目录,`paths` 则定义了路径别名与实际路径之间的映射关系。\n路径映射的核心价值在于解决深层嵌套目录结构中的导入问题。当项目变得复杂时,相对路径可能会变成类似 `../../../../utils/he" }, { "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "relativePath": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "excerpt": "", "capture": "一、工作区\n\npnpm 内置了对单一存储库(也称为多包存储库、多项目存储库或整体存储库)的支持。你可以创建一个工作区来将多个项目联合到一个存储库中。\n> 工作区的根目录中必须有一个 `pnpm-workspace.yaml` 文件。\n 1. 工作区协议\n如果 linkWorkspacePackages 设置为 `true`,如果可用包与声明的范围匹配,pnpm 将从工作区链接包。例如,如果 `bar` 在其依赖中有 `\"foo\": \"^1.0.0\"` 并且 `foo@1.0.0` 在工作区中,则 `foo@1.0.0` 链接到 `bar`。但是,如果 `bar` 在依赖中有 `\"foo\"" } ], "sortPostsByDate": [ { "url": "/Examples/api-examples.html", "relativePath": "/Examples/api-examples.html", "frontmatter": { "outline": "deep" }, "title": "Runtime API Examples", "date": "2025-08-25 14:23:00", "capture": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.\nThe main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:\n```md\n<script setup\nimport { useData } from 'vitepress'\ncon" }, { "url": "/Examples/", "relativePath": "/Examples/", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" }, "title": "Examples", "date": "2025-08-25 14:23:00", "capture": "这里建立vitepress时的示例文档。" }, { "url": "/Examples/markdown-examples.html", "relativePath": "/Examples/markdown-examples.html", "frontmatter": {}, "title": "Markdown Extension Examples", "date": "2025-08-25 14:23:00", "capture": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highlighting\nVitePress provides Syntax Highlighting powered by Shiki, with additional features like line-highlighting:\nInput\n````md\n```js{4}\nexport default {\n data () {\n return {\n msg: 'Highlighte" }, { "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "relativePath": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {}, "title": "Git 提交规范与工具集成", "date": "2025-08-25 14:23:00", "capture": "在现代前端开发中,规范化的 Git 提交信息对于项目维护和版本管理至关重要。本文将详细介绍 husky、cz-git 和 @commitlint/cli 三个工具的使用方法,以及如何建立一套完整的 Git 提交规范体系。\n\n 一、Husky - Git 钩子工具\n 1. 简介\nHusky 是一个现代化的 Git 钩子管理工具,它允许我们在 Git 的各个生命周期节点(如 pre-commit、commit-msg 等)执行自定义脚本。通过 Husky,我们可以自动化执行代码检查、测试、提交信息验证等任务。\n> Git仓库:GitHub - typicode/husky: Git hook" }, { "url": "/sdoc/01-开发/", "relativePath": "/sdoc/01-开发/", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" }, "title": "开发", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/sdoc/02-组件/01-公共组件/", "relativePath": "/sdoc/02-组件/01-公共组件/", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" }, "title": "公共组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有公共组件的使用文档。" }, { "url": "/sdoc/02-组件/02-主题组件/", "relativePath": "/sdoc/02-组件/02-主题组件/", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" }, "title": "主题组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有主题组件的使用文档。" }, { "url": "/sdoc/02-组件/", "relativePath": "/sdoc/02-组件/", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" }, "title": "组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有组件的使用文档。" }, { "url": "/sdoc/03-插件/LV01-file-content-loader.html", "relativePath": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {}, "title": "vitepress-plugin-file-content-loader", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-file-content-loader` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描和处理指定的文件内容。该插件将 VitePress 官方的构建时数据加载功能封装成独立的插件形式,使开发者能够更便捷地获取和处理项目中的 Markdown 文件内容。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 文件内容扫描与处理\n- 在 VitePress 启动时扫描项目中指定的文件(默认为 Markdown 文档)\n- 解析文件的 frontmatter" }, { "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "relativePath": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {}, "title": "vitepress-plugin-catalogue 插件深度解析", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-catalogue` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描 Markdown 文档并生成目录信息。该插件能够自动识别标记为目录页的文档,并为其生成结构化的目录数据,便于开发者创建美观实用的目录页面。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 目录数据自动生成\n- 在 VitePress 启动时扫描项目中的 Markdown 文档\n- 识别具有 `catalogue: true` 和 `path` 属性的文档作为目录页\n- 根据指定路" }, { "url": "/sdoc/03-插件/", "relativePath": "/sdoc/03-插件/", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" }, "title": "插件", "date": "2025-08-25 14:23:00", "capture": "这里一些插件文档。" }, { "url": "/sdoc/", "relativePath": "/sdoc/", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" }, "title": "我的文档", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/test/articlePage/aside.html", "relativePath": "/test/articlePage/aside.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc aside class=\"demo-article-page-aside\">\n <h1 id=\"一级标题\">\n 一级标题\n <a class=\"header-anchor\" href=\"一级标题\" aria-label=\"Permalink to '一级标题'\" />\n </h1>\n <h2 i" }, { "url": "/test/articlePage/doc.html", "relativePath": "/test/articlePage/doc.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc class=\"demo-article-page-doc\">\n <h1>使用doc配置项的MtArticlePage</h1>\n <h2>二级标题</h2>\n <p>content a</p>\n <h3>三级标题</h3>\n <p>con" }, { "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下Breadcrumb面包屑组件。</p>\n", "capture": "这一部分来了解一下Breadcrumb面包屑组件。\n<script setup\nimport { MtBreadcrumb, MtBreadcrumbItem } from \"vitepress-theme-mist\"\n</script>\n 一、组件介绍\nBreadcrumb(面包屑)是一种导航组件,用于显示用户在网站或应用中的当前位置。它可以帮助用户理解他们所在的层级结构,并提供快速返回上一级或首页的导航路径。\n 特点\n- 简洁直观:清晰的层级结构展示\n- 高度可定制:支持自定义分隔符\n- 灵活使用:支持纯文本、图标、链接等多种内容形式\n- 无障碍支持:内置ARIA属性,提" }, { "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleBreadcrumb文章面包屑组件。</p>\n", "capture": "这一部分来了解一下ArticleBreadcrumb文章面包屑组件。\n<script setup\nimport { MtArticleBreadcrumb } from \"@mist/components/theme/ArticleBreadcrumb\"\n</script>\n 一、组件介绍\nArticleBreadcrumb(文章面包屑)是一个为文章页面设计的面包屑组件,它会根据当前页面的路径自动生成面包屑导航。该组件是基于基础的 Breadcrumb 组件构建的,但针对文章页面进行了优化。\n 二、基础用法\n 1. 默认用法\n在文章页面中直接使用 ArticleBreadcr" }, { "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleInfo文章信息组件。</p>\n", "capture": "这一部分来了解一下ArticleInfo文章信息组件。\n<script setup\nimport { MtArticleInfo } from \"@mist/components/theme/ArticleInfo\"\n</script>\n 一、组件介绍\nArticleInfo(文章信息)是一个用于显示文章基本信息的组件,包括作者、创建时间、更新时间、分类、标签等内容。该组件会根据主题配置自动显示相应的信息,并支持在首页和文章页的不同展示需求。\n 二、基础用法\n 1. 默认用法\n在文章页面中使用 ArticleInfo 组件,传入文章数据和作用域:\nArticleInfo/ba" }, { "url": "/sdoc/01-开发/LV07-Vite插件.html", "relativePath": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "capture": "VitePress 处于 Vite 环境下,因此天然支持 Vite 插件。\n 一、Vite 插件基础模板\n首先介绍 Vite 插件的基础模板:\n```ts\nimport type { Plugin } from \"vite\";\ninterface Options {\n // ...\n}\nexport default function VitePluginVitePressTemplate(option: Options = {}): Plugin {\n return {\n name: \"vite-plugin-vitepress-template\",\n // ...\n };\n" }, { "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "relativePath": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "capture": "SCSS变量未展开问题分析\n 一、问题描述\n在 `packages\\theme-chalk\\src\\var\\theme-color.scss` 文件中,第46-51行的代码:\n```scss\nhtml[theme-color=\"ep-blue\"] {\n --vp-c-brand-1: {getCssVar(\"el-color-primary\")};\n --vp-c-brand-2: {getCssVar(\"el-color-primary-light-3\")};\n --vp-c-brand-3: {getCssVar(\"el-color-primary-light-5\")};\n --v" }, { "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "excerpt": "<p>这一部分来了解一下ArticlePage文章页组件。</p>\n", "capture": "这一部分来了解一下ArticlePage文章页组件。\n<script setup\nimport { MtArticlePage } from \"vitepress-theme-mist\"\n</script>\n 一、page布局\n当在 Markdown 文档将 `frontmatter.layout` 设置为 `page`,VitePress 不会对该 Markdown 生成的文章页应用任何样式,这对于需要创建一个完全自定义的页面时很有用。当没有设置`frontmatter.layout`时,默认使用的是`doc`布局,是这样的:\n当改为page布局,会变成这样:\n 二、文章页" }, { "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" }, "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "excerpt": "", "capture": "<script setup\nimport { MtSegmented, MtSegmentedItem } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst basicValue = ref('option1')\nconst disabledValue = ref('option1')\nconst iconValue = ref(\"ep:coordinate\")\nconst mixedValue = ref('option1')\nconst numberValue = ref(1)\nconst basicOptions" }, { "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" }, "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "excerpt": "", "capture": "<script setup\nimport { MtPopover, MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 不同触发方式示例\nconst clickVisible = ref(false)\nconst hoverVisible = ref(false)\nconst focusVisible = ref(false)\n// 不同位置示例\nconst topVisible = ref(false)\nconst rightVisible = ref(false)\nconst bottomVisibl" }, { "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "capture": "Demo 插件与 MtDemoCode 组件分析\n 一、概述\n本文档深入分析 VitePress 主题中的 `demo` 插件 (`packages/markdown/plugins/demo.ts`) 和 `MtDemoCode` 组件 (`packages/components/theme/DemoCode/src/index.vue`)。这两个组件协同工作,实现在 Markdown 文档中嵌入可交互的 Vue 组件示例,并提供源代码查看、复制等功能。\n 二、工作原理总览\n整个流程可以分为以下几个步骤:\n(1)Markdown 解析阶段:VitePress 使用 `demo` 插件解析 M" }, { "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" }, "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "excerpt": "", "capture": "<script setup\nimport { MtMessage } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst showMessage = (type = 'info') => {\n MtMessagetype\n}\nconst showCustomMessage = () => {\n MtMessage({\n message: '这是一条自定义消息,持续5秒',\n type: 'success',\n duration: 5000,\n showClose: true,\n " }, { "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" }, "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "excerpt": "", "capture": "<script setup\nimport { MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 基础示例\nconst basicClickCount = ref(0)\nconst handleBasicClick = () => {\n basicClickCount.value++\n}\n// 不同类型示例\nconst primaryClickCount = ref(0)\nconst handlePrimaryClick = () => {\n primaryClickCount.value" }, { "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "capture": "<!-- 引入 iconfont 在线图标样式 --\n<link rel=\"stylesheet\" href=\"//at.alicdn.com/t/font_2989306_w303erbip9.css\" />\n<script setup lang=\"ts\">\nimport { MtIcon } from \"vitepress-theme-mist\";\nimport { gitee, email, WhatsApp, telegram, github, bilibili, moblieQQ, music } from \"vitepress-theme-mist\";" }, { "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" }, "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "excerpt": "", "capture": "<script setup\nimport { MtInputSlide } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst value1 = ref(50) // 基础示例\nconst value2 = ref(100) // 自定义范围示例\nconst value3 = ref(5) // 设置步长示例\nconst value4 = ref(30) // 禁用状态示例\nconst value5 = ref(75) // 自定义格式化示例\nconst formatPercentage = (val) =&g" }, { "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" }, "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "excerpt": "", "capture": "<script setup\nimport { MtTransitionCollapse } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst show = ref(false)\n</script>\n<style scoped>\n.preview-container {\n padding: 20px;\n border: 1px solid ddd;\n border-radius: 4px;\n}\n.content {\n padding: 10px;\n background-color:rg" }, { "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "excerpt": "", "capture": "简介\n这是一个回到顶部按钮。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtBackTop minScrollY=\"value\"/\n```\nminScrollY表示向下滚动多少px后出现回到顶部按钮。\n 效果\n页面向下滚动就可以看到右下角出现轨道顶部按钮了。\n<MtBackTop minScrollY=\"20\"/>" }, { "url": "/sdoc/01-开发/LV04-主题配置.html", "relativePath": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "excerpt": "<p>vitepress的配置合并。</p>\n", "capture": "vitepress的配置合并。\n 一、概述\n当建立一个vitepress站点后,得到的默认配置文件如下:\n```typescript\nimport { defineConfig } from 'vitepress'\n// https://vitepress.dev/reference/site-config\nexport default defineConfig({\n title: \"mist docs\",\n description: \"vitepress-theme-mist docs\",\n themeConfig: {\n // https://vitepress.dev/ref" }, { "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "excerpt": "", "capture": "<script setup\nimport { MtDataLoader } from \"vitepress-theme-mist\"\n</script>\n 简介\n第一个组件,主要是学习组件的写法和用法。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtDataLoader />\n```\n 效果\n<MtDataLoader />" }, { "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "relativePath": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "capture": "DataLoader 组件导入过程分析\n 概述\n本文档详细分析了 DataLoader 组件在项目中的目录结构、各文件作用以及从组件实现到最终在 `@docs-site/vitepress-theme-mist` 主题中注册的完整导入链路。\n 1. 目录结构分析\n 1.1 目录结构\n```bash\n📁 DataLoader/\n├── 📄 index.ts 组件主入口文件\n├── 📁 src/\n│ ├── 📄 DataLoader.vue 组件实现文件\n│ ├── 📄 DataLoader.ts 类型定" }, { "url": "/sdoc/01-开发/LV03-主题入口分析.html", "relativePath": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "capture": "一、开发指南\n主题的主入口文件为`packages/mist/index.ts`,这里的index.ts将会在vitepress站点的`.vitepress/theme/index.ts`中导入和调用。\n 二、Workspace 机制详解\n 1. 项目配置分析\n 1.1 pnpm-workspace.yaml\n```yaml\n pnpm-workspace.yaml\npackages:\n - docs\n - packages/*\n```\n这个配置定义了 Workspace 的范围,包含了 `packages` 目录下的所有子目录。\n 1.2 packages/mist/package.js" }, { "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "relativePath": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "excerpt": "", "capture": "一、Typescript路径映射\nTypescript 路径映射(Path Mapping)是一种允许开发者在导入模块时使用自定义路径别名而不是相对路径的功能。这使得代码更加清晰、易于维护,并且在重构项目结构时更加方便。\n 1. 基本概念\n路径映射通过在 `tsconfig.json` 文件中配置 `paths` 和 `baseUrl` 来实现。`baseUrl` 指定了非相对路径模块的基础目录,`paths` 则定义了路径别名与实际路径之间的映射关系。\n路径映射的核心价值在于解决深层嵌套目录结构中的导入问题。当项目变得复杂时,相对路径可能会变成类似 `../../../../utils/he" }, { "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "relativePath": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "excerpt": "", "capture": "一、工作区\n\npnpm 内置了对单一存储库(也称为多包存储库、多项目存储库或整体存储库)的支持。你可以创建一个工作区来将多个项目联合到一个存储库中。\n> 工作区的根目录中必须有一个 `pnpm-workspace.yaml` 文件。\n 1. 工作区协议\n如果 linkWorkspacePackages 设置为 `true`,如果可用包与声明的范围匹配,pnpm 将从工作区链接包。例如,如果 `bar` 在其依赖中有 `\"foo\": \"^1.0.0\"` 并且 `foo@1.0.0` 在工作区中,则 `foo@1.0.0` 链接到 `bar`。但是,如果 `bar` 在依赖中有 `\"foo\"" } ], "groupPostsByYear": { "2025 ": [ { "url": "/Examples/api-examples.html", "relativePath": "/Examples/api-examples.html", "frontmatter": { "outline": "deep" }, "title": "Runtime API Examples", "date": "2025-08-25 14:23:00", "capture": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.\nThe main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:\n```md\n<script setup\nimport { useData } from 'vitepress'\ncon" }, { "url": "/Examples/", "relativePath": "/Examples/", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" }, "title": "Examples", "date": "2025-08-25 14:23:00", "capture": "这里建立vitepress时的示例文档。" }, { "url": "/Examples/markdown-examples.html", "relativePath": "/Examples/markdown-examples.html", "frontmatter": {}, "title": "Markdown Extension Examples", "date": "2025-08-25 14:23:00", "capture": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highlighting\nVitePress provides Syntax Highlighting powered by Shiki, with additional features like line-highlighting:\nInput\n````md\n```js{4}\nexport default {\n data () {\n return {\n msg: 'Highlighte" }, { "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "relativePath": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {}, "title": "Git 提交规范与工具集成", "date": "2025-08-25 14:23:00", "capture": "在现代前端开发中,规范化的 Git 提交信息对于项目维护和版本管理至关重要。本文将详细介绍 husky、cz-git 和 @commitlint/cli 三个工具的使用方法,以及如何建立一套完整的 Git 提交规范体系。\n\n 一、Husky - Git 钩子工具\n 1. 简介\nHusky 是一个现代化的 Git 钩子管理工具,它允许我们在 Git 的各个生命周期节点(如 pre-commit、commit-msg 等)执行自定义脚本。通过 Husky,我们可以自动化执行代码检查、测试、提交信息验证等任务。\n> Git仓库:GitHub - typicode/husky: Git hook" }, { "url": "/sdoc/01-开发/", "relativePath": "/sdoc/01-开发/", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" }, "title": "开发", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/sdoc/02-组件/01-公共组件/", "relativePath": "/sdoc/02-组件/01-公共组件/", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" }, "title": "公共组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有公共组件的使用文档。" }, { "url": "/sdoc/02-组件/02-主题组件/", "relativePath": "/sdoc/02-组件/02-主题组件/", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" }, "title": "主题组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有主题组件的使用文档。" }, { "url": "/sdoc/02-组件/", "relativePath": "/sdoc/02-组件/", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" }, "title": "组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有组件的使用文档。" }, { "url": "/sdoc/03-插件/LV01-file-content-loader.html", "relativePath": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {}, "title": "vitepress-plugin-file-content-loader", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-file-content-loader` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描和处理指定的文件内容。该插件将 VitePress 官方的构建时数据加载功能封装成独立的插件形式,使开发者能够更便捷地获取和处理项目中的 Markdown 文件内容。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 文件内容扫描与处理\n- 在 VitePress 启动时扫描项目中指定的文件(默认为 Markdown 文档)\n- 解析文件的 frontmatter" }, { "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "relativePath": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {}, "title": "vitepress-plugin-catalogue 插件深度解析", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-catalogue` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描 Markdown 文档并生成目录信息。该插件能够自动识别标记为目录页的文档,并为其生成结构化的目录数据,便于开发者创建美观实用的目录页面。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 目录数据自动生成\n- 在 VitePress 启动时扫描项目中的 Markdown 文档\n- 识别具有 `catalogue: true` 和 `path` 属性的文档作为目录页\n- 根据指定路" }, { "url": "/sdoc/03-插件/", "relativePath": "/sdoc/03-插件/", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" }, "title": "插件", "date": "2025-08-25 14:23:00", "capture": "这里一些插件文档。" }, { "url": "/sdoc/", "relativePath": "/sdoc/", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" }, "title": "我的文档", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/test/articlePage/aside.html", "relativePath": "/test/articlePage/aside.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc aside class=\"demo-article-page-aside\">\n <h1 id=\"一级标题\">\n 一级标题\n <a class=\"header-anchor\" href=\"一级标题\" aria-label=\"Permalink to '一级标题'\" />\n </h1>\n <h2 i" }, { "url": "/test/articlePage/doc.html", "relativePath": "/test/articlePage/doc.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc class=\"demo-article-page-doc\">\n <h1>使用doc配置项的MtArticlePage</h1>\n <h2>二级标题</h2>\n <p>content a</p>\n <h3>三级标题</h3>\n <p>con" }, { "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下Breadcrumb面包屑组件。</p>\n", "capture": "这一部分来了解一下Breadcrumb面包屑组件。\n<script setup\nimport { MtBreadcrumb, MtBreadcrumbItem } from \"vitepress-theme-mist\"\n</script>\n 一、组件介绍\nBreadcrumb(面包屑)是一种导航组件,用于显示用户在网站或应用中的当前位置。它可以帮助用户理解他们所在的层级结构,并提供快速返回上一级或首页的导航路径。\n 特点\n- 简洁直观:清晰的层级结构展示\n- 高度可定制:支持自定义分隔符\n- 灵活使用:支持纯文本、图标、链接等多种内容形式\n- 无障碍支持:内置ARIA属性,提" }, { "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleBreadcrumb文章面包屑组件。</p>\n", "capture": "这一部分来了解一下ArticleBreadcrumb文章面包屑组件。\n<script setup\nimport { MtArticleBreadcrumb } from \"@mist/components/theme/ArticleBreadcrumb\"\n</script>\n 一、组件介绍\nArticleBreadcrumb(文章面包屑)是一个为文章页面设计的面包屑组件,它会根据当前页面的路径自动生成面包屑导航。该组件是基于基础的 Breadcrumb 组件构建的,但针对文章页面进行了优化。\n 二、基础用法\n 1. 默认用法\n在文章页面中直接使用 ArticleBreadcr" }, { "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleInfo文章信息组件。</p>\n", "capture": "这一部分来了解一下ArticleInfo文章信息组件。\n<script setup\nimport { MtArticleInfo } from \"@mist/components/theme/ArticleInfo\"\n</script>\n 一、组件介绍\nArticleInfo(文章信息)是一个用于显示文章基本信息的组件,包括作者、创建时间、更新时间、分类、标签等内容。该组件会根据主题配置自动显示相应的信息,并支持在首页和文章页的不同展示需求。\n 二、基础用法\n 1. 默认用法\n在文章页面中使用 ArticleInfo 组件,传入文章数据和作用域:\nArticleInfo/ba" }, { "url": "/sdoc/01-开发/LV07-Vite插件.html", "relativePath": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "capture": "VitePress 处于 Vite 环境下,因此天然支持 Vite 插件。\n 一、Vite 插件基础模板\n首先介绍 Vite 插件的基础模板:\n```ts\nimport type { Plugin } from \"vite\";\ninterface Options {\n // ...\n}\nexport default function VitePluginVitePressTemplate(option: Options = {}): Plugin {\n return {\n name: \"vite-plugin-vitepress-template\",\n // ...\n };\n" }, { "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "relativePath": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "capture": "SCSS变量未展开问题分析\n 一、问题描述\n在 `packages\\theme-chalk\\src\\var\\theme-color.scss` 文件中,第46-51行的代码:\n```scss\nhtml[theme-color=\"ep-blue\"] {\n --vp-c-brand-1: {getCssVar(\"el-color-primary\")};\n --vp-c-brand-2: {getCssVar(\"el-color-primary-light-3\")};\n --vp-c-brand-3: {getCssVar(\"el-color-primary-light-5\")};\n --v" }, { "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "excerpt": "<p>这一部分来了解一下ArticlePage文章页组件。</p>\n", "capture": "这一部分来了解一下ArticlePage文章页组件。\n<script setup\nimport { MtArticlePage } from \"vitepress-theme-mist\"\n</script>\n 一、page布局\n当在 Markdown 文档将 `frontmatter.layout` 设置为 `page`,VitePress 不会对该 Markdown 生成的文章页应用任何样式,这对于需要创建一个完全自定义的页面时很有用。当没有设置`frontmatter.layout`时,默认使用的是`doc`布局,是这样的:\n当改为page布局,会变成这样:\n 二、文章页" }, { "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" }, "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "excerpt": "", "capture": "<script setup\nimport { MtSegmented, MtSegmentedItem } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst basicValue = ref('option1')\nconst disabledValue = ref('option1')\nconst iconValue = ref(\"ep:coordinate\")\nconst mixedValue = ref('option1')\nconst numberValue = ref(1)\nconst basicOptions" }, { "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" }, "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "excerpt": "", "capture": "<script setup\nimport { MtPopover, MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 不同触发方式示例\nconst clickVisible = ref(false)\nconst hoverVisible = ref(false)\nconst focusVisible = ref(false)\n// 不同位置示例\nconst topVisible = ref(false)\nconst rightVisible = ref(false)\nconst bottomVisibl" }, { "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "capture": "Demo 插件与 MtDemoCode 组件分析\n 一、概述\n本文档深入分析 VitePress 主题中的 `demo` 插件 (`packages/markdown/plugins/demo.ts`) 和 `MtDemoCode` 组件 (`packages/components/theme/DemoCode/src/index.vue`)。这两个组件协同工作,实现在 Markdown 文档中嵌入可交互的 Vue 组件示例,并提供源代码查看、复制等功能。\n 二、工作原理总览\n整个流程可以分为以下几个步骤:\n(1)Markdown 解析阶段:VitePress 使用 `demo` 插件解析 M" }, { "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" }, "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "excerpt": "", "capture": "<script setup\nimport { MtMessage } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst showMessage = (type = 'info') => {\n MtMessagetype\n}\nconst showCustomMessage = () => {\n MtMessage({\n message: '这是一条自定义消息,持续5秒',\n type: 'success',\n duration: 5000,\n showClose: true,\n " }, { "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" }, "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "excerpt": "", "capture": "<script setup\nimport { MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 基础示例\nconst basicClickCount = ref(0)\nconst handleBasicClick = () => {\n basicClickCount.value++\n}\n// 不同类型示例\nconst primaryClickCount = ref(0)\nconst handlePrimaryClick = () => {\n primaryClickCount.value" }, { "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "capture": "<!-- 引入 iconfont 在线图标样式 --\n<link rel=\"stylesheet\" href=\"//at.alicdn.com/t/font_2989306_w303erbip9.css\" />\n<script setup lang=\"ts\">\nimport { MtIcon } from \"vitepress-theme-mist\";\nimport { gitee, email, WhatsApp, telegram, github, bilibili, moblieQQ, music } from \"vitepress-theme-mist\";" }, { "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" }, "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "excerpt": "", "capture": "<script setup\nimport { MtInputSlide } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst value1 = ref(50) // 基础示例\nconst value2 = ref(100) // 自定义范围示例\nconst value3 = ref(5) // 设置步长示例\nconst value4 = ref(30) // 禁用状态示例\nconst value5 = ref(75) // 自定义格式化示例\nconst formatPercentage = (val) =&g" }, { "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" }, "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "excerpt": "", "capture": "<script setup\nimport { MtTransitionCollapse } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst show = ref(false)\n</script>\n<style scoped>\n.preview-container {\n padding: 20px;\n border: 1px solid ddd;\n border-radius: 4px;\n}\n.content {\n padding: 10px;\n background-color:rg" }, { "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "excerpt": "", "capture": "简介\n这是一个回到顶部按钮。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtBackTop minScrollY=\"value\"/\n```\nminScrollY表示向下滚动多少px后出现回到顶部按钮。\n 效果\n页面向下滚动就可以看到右下角出现轨道顶部按钮了。\n<MtBackTop minScrollY=\"20\"/>" }, { "url": "/sdoc/01-开发/LV04-主题配置.html", "relativePath": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "excerpt": "<p>vitepress的配置合并。</p>\n", "capture": "vitepress的配置合并。\n 一、概述\n当建立一个vitepress站点后,得到的默认配置文件如下:\n```typescript\nimport { defineConfig } from 'vitepress'\n// https://vitepress.dev/reference/site-config\nexport default defineConfig({\n title: \"mist docs\",\n description: \"vitepress-theme-mist docs\",\n themeConfig: {\n // https://vitepress.dev/ref" }, { "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "excerpt": "", "capture": "<script setup\nimport { MtDataLoader } from \"vitepress-theme-mist\"\n</script>\n 简介\n第一个组件,主要是学习组件的写法和用法。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtDataLoader />\n```\n 效果\n<MtDataLoader />" }, { "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "relativePath": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "capture": "DataLoader 组件导入过程分析\n 概述\n本文档详细分析了 DataLoader 组件在项目中的目录结构、各文件作用以及从组件实现到最终在 `@docs-site/vitepress-theme-mist` 主题中注册的完整导入链路。\n 1. 目录结构分析\n 1.1 目录结构\n```bash\n📁 DataLoader/\n├── 📄 index.ts 组件主入口文件\n├── 📁 src/\n│ ├── 📄 DataLoader.vue 组件实现文件\n│ ├── 📄 DataLoader.ts 类型定" }, { "url": "/sdoc/01-开发/LV03-主题入口分析.html", "relativePath": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "capture": "一、开发指南\n主题的主入口文件为`packages/mist/index.ts`,这里的index.ts将会在vitepress站点的`.vitepress/theme/index.ts`中导入和调用。\n 二、Workspace 机制详解\n 1. 项目配置分析\n 1.1 pnpm-workspace.yaml\n```yaml\n pnpm-workspace.yaml\npackages:\n - docs\n - packages/*\n```\n这个配置定义了 Workspace 的范围,包含了 `packages` 目录下的所有子目录。\n 1.2 packages/mist/package.js" }, { "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "relativePath": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "excerpt": "", "capture": "一、Typescript路径映射\nTypescript 路径映射(Path Mapping)是一种允许开发者在导入模块时使用自定义路径别名而不是相对路径的功能。这使得代码更加清晰、易于维护,并且在重构项目结构时更加方便。\n 1. 基本概念\n路径映射通过在 `tsconfig.json` 文件中配置 `paths` 和 `baseUrl` 来实现。`baseUrl` 指定了非相对路径模块的基础目录,`paths` 则定义了路径别名与实际路径之间的映射关系。\n路径映射的核心价值在于解决深层嵌套目录结构中的导入问题。当项目变得复杂时,相对路径可能会变成类似 `../../../../utils/he" }, { "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "relativePath": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "excerpt": "", "capture": "一、工作区\n\npnpm 内置了对单一存储库(也称为多包存储库、多项目存储库或整体存储库)的支持。你可以创建一个工作区来将多个项目联合到一个存储库中。\n> 工作区的根目录中必须有一个 `pnpm-workspace.yaml` 文件。\n 1. 工作区协议\n如果 linkWorkspacePackages 设置为 `true`,如果可用包与声明的范围匹配,pnpm 将从工作区链接包。例如,如果 `bar` 在其依赖中有 `\"foo\": \"^1.0.0\"` 并且 `foo@1.0.0` 在工作区中,则 `foo@1.0.0` 链接到 `bar`。但是,如果 `bar` 在依赖中有 `\"foo\"" } ] }, "groupPostsByYearMonth": { "2025 ": { "08": [ { "url": "/Examples/api-examples.html", "relativePath": "/Examples/api-examples.html", "frontmatter": { "outline": "deep" }, "title": "Runtime API Examples", "date": "2025-08-25 14:23:00", "capture": "Runtime API Examples\nThis page demonstrates usage of some of the runtime APIs provided by VitePress.\nThe main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:\n```md\n<script setup\nimport { useData } from 'vitepress'\ncon" }, { "url": "/Examples/", "relativePath": "/Examples/", "frontmatter": { "title": "Examples", "index": false, "icon": "laptop-code" }, "title": "Examples", "date": "2025-08-25 14:23:00", "capture": "这里建立vitepress时的示例文档。" }, { "url": "/Examples/markdown-examples.html", "relativePath": "/Examples/markdown-examples.html", "frontmatter": {}, "title": "Markdown Extension Examples", "date": "2025-08-25 14:23:00", "capture": "This page demonstrates some of the built-in markdown extensions provided by VitePress.\n Syntax Highlighting\nVitePress provides Syntax Highlighting powered by Shiki, with additional features like line-highlighting:\nInput\n````md\n```js{4}\nexport default {\n data () {\n return {\n msg: 'Highlighte" }, { "url": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "relativePath": "/sdoc/01-开发/LV08-Git提交规范与工具集成.html", "frontmatter": {}, "title": "Git 提交规范与工具集成", "date": "2025-08-25 14:23:00", "capture": "在现代前端开发中,规范化的 Git 提交信息对于项目维护和版本管理至关重要。本文将详细介绍 husky、cz-git 和 @commitlint/cli 三个工具的使用方法,以及如何建立一套完整的 Git 提交规范体系。\n\n 一、Husky - Git 钩子工具\n 1. 简介\nHusky 是一个现代化的 Git 钩子管理工具,它允许我们在 Git 的各个生命周期节点(如 pre-commit、commit-msg 等)执行自定义脚本。通过 Husky,我们可以自动化执行代码检查、测试、提交信息验证等任务。\n> Git仓库:GitHub - typicode/husky: Git hook" }, { "url": "/sdoc/01-开发/", "relativePath": "/sdoc/01-开发/", "frontmatter": { "title": "开发", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/01-开发" }, "title": "开发", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/sdoc/02-组件/01-公共组件/", "relativePath": "/sdoc/02-组件/01-公共组件/", "frontmatter": { "title": "公共组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/01-公共组件" }, "title": "公共组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有公共组件的使用文档。" }, { "url": "/sdoc/02-组件/02-主题组件/", "relativePath": "/sdoc/02-组件/02-主题组件/", "frontmatter": { "title": "主题组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件/02-主题组件" }, "title": "主题组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有主题组件的使用文档。" }, { "url": "/sdoc/02-组件/", "relativePath": "/sdoc/02-组件/", "frontmatter": { "title": "组件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/02-组件" }, "title": "组件", "date": "2025-08-25 14:23:00", "capture": "这里是编写的所有组件的使用文档。" }, { "url": "/sdoc/03-插件/LV01-file-content-loader.html", "relativePath": "/sdoc/03-插件/LV01-file-content-loader.html", "frontmatter": {}, "title": "vitepress-plugin-file-content-loader", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-file-content-loader` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描和处理指定的文件内容。该插件将 VitePress 官方的构建时数据加载功能封装成独立的插件形式,使开发者能够更便捷地获取和处理项目中的 Markdown 文件内容。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 文件内容扫描与处理\n- 在 VitePress 启动时扫描项目中指定的文件(默认为 Markdown 文档)\n- 解析文件的 frontmatter" }, { "url": "/sdoc/03-插件/LV02-catalogue分析文档.html", "relativePath": "/sdoc/03-插件/LV02-catalogue分析文档.html", "frontmatter": {}, "title": "vitepress-plugin-catalogue 插件深度解析", "date": "2025-08-25 14:23:00", "capture": "一、概述\n`vitepress-plugin-catalogue` 是 Teek 主题生态系统中的一个重要插件,专门用于在 VitePress 项目构建时扫描 Markdown 文档并生成目录信息。该插件能够自动识别标记为目录页的文档,并为其生成结构化的目录数据,便于开发者创建美观实用的目录页面。\n本文将围绕其设计思路、技术实现、配置选项以及与其他组件间的协作机制展开全面剖析。\n 二、基本功能\n 1. 目录数据自动生成\n- 在 VitePress 启动时扫描项目中的 Markdown 文档\n- 识别具有 `catalogue: true` 和 `path` 属性的文档作为目录页\n- 根据指定路" }, { "url": "/sdoc/03-插件/", "relativePath": "/sdoc/03-插件/", "frontmatter": { "title": "插件", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc/03-插件" }, "title": "插件", "date": "2025-08-25 14:23:00", "capture": "这里一些插件文档。" }, { "url": "/sdoc/", "relativePath": "/sdoc/", "frontmatter": { "title": "我的文档", "index": false, "icon": "laptop-code", "layout": "page", "catalogue": true, "path": "sdoc" }, "title": "我的文档", "date": "2025-08-25 14:23:00", "capture": "这里是主题开发过程中的一些笔记。" }, { "url": "/test/articlePage/aside.html", "relativePath": "/test/articlePage/aside.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc aside class=\"demo-article-page-aside\">\n <h1 id=\"一级标题\">\n 一级标题\n <a class=\"header-anchor\" href=\"一级标题\" aria-label=\"Permalink to '一级标题'\" />\n </h1>\n <h2 i" }, { "url": "/test/articlePage/doc.html", "relativePath": "/test/articlePage/doc.html", "frontmatter": { "layout": false }, "title": "html", "date": "2025-08-25 14:23:00", "capture": "<script setup lang=\"ts\"\nimport { MtArticlePage } from \"vitepress-theme-mist\";\n</script>\n<MtArticlePage doc class=\"demo-article-page-doc\">\n <h1>使用doc配置项的MtArticlePage</h1>\n <h2>二级标题</h2>\n <p>content a</p>\n <h3>三级标题</h3>\n <p>con" }, { "url": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV11-Breadcrumb面包屑.html", "frontmatter": { "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV11-Breadcrumb面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下Breadcrumb面包屑组件。</p>\n", "capture": "这一部分来了解一下Breadcrumb面包屑组件。\n<script setup\nimport { MtBreadcrumb, MtBreadcrumbItem } from \"vitepress-theme-mist\"\n</script>\n 一、组件介绍\nBreadcrumb(面包屑)是一种导航组件,用于显示用户在网站或应用中的当前位置。它可以帮助用户理解他们所在的层级结构,并提供快速返回上一级或首页的导航路径。\n 特点\n- 简洁直观:清晰的层级结构展示\n- 高度可定制:支持自定义分隔符\n- 灵活使用:支持纯文本、图标、链接等多种内容形式\n- 无障碍支持:内置ARIA属性,提" }, { "url": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV02-ArticleBreadcrumb文章面包屑.html", "frontmatter": { "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-ArticleBreadcrumb文章面包屑", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleBreadcrumb文章面包屑组件。</p>\n", "capture": "这一部分来了解一下ArticleBreadcrumb文章面包屑组件。\n<script setup\nimport { MtArticleBreadcrumb } from \"@mist/components/theme/ArticleBreadcrumb\"\n</script>\n 一、组件介绍\nArticleBreadcrumb(文章面包屑)是一个为文章页面设计的面包屑组件,它会根据当前页面的路径自动生成面包屑导航。该组件是基于基础的 Breadcrumb 组件构建的,但针对文章页面进行了优化。\n 二、基础用法\n 1. 默认用法\n在文章页面中直接使用 ArticleBreadcr" }, { "url": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV03-ArticleInfo文章信息.html", "frontmatter": { "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "icon": "material-symbols:info", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-ArticleInfo文章信息", "date": "2025-08-24 12:05:00", "excerpt": "<p>这一部分来了解一下ArticleInfo文章信息组件。</p>\n", "capture": "这一部分来了解一下ArticleInfo文章信息组件。\n<script setup\nimport { MtArticleInfo } from \"@mist/components/theme/ArticleInfo\"\n</script>\n 一、组件介绍\nArticleInfo(文章信息)是一个用于显示文章基本信息的组件,包括作者、创建时间、更新时间、分类、标签等内容。该组件会根据主题配置自动显示相应的信息,并支持在首页和文章页的不同展示需求。\n 二、基础用法\n 1. 默认用法\n在文章页面中使用 ArticleInfo 组件,传入文章数据和作用域:\nArticleInfo/ba" }, { "url": "/sdoc/01-开发/LV07-Vite插件.html", "relativePath": "/sdoc/01-开发/LV07-Vite插件.html", "frontmatter": { "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV07-Vite插件", "date": "2025-08-23 10:59:28", "capture": "VitePress 处于 Vite 环境下,因此天然支持 Vite 插件。\n 一、Vite 插件基础模板\n首先介绍 Vite 插件的基础模板:\n```ts\nimport type { Plugin } from \"vite\";\ninterface Options {\n // ...\n}\nexport default function VitePluginVitePressTemplate(option: Options = {}): Plugin {\n return {\n name: \"vite-plugin-vitepress-template\",\n // ...\n };\n" }, { "url": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "relativePath": "/sdoc/01-开发/LV06-SCSS变量未展开问题分析.html", "frontmatter": { "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV06-SCSS变量未展开问题分析", "date": "2025-08-22 10:59:28", "capture": "SCSS变量未展开问题分析\n 一、问题描述\n在 `packages\\theme-chalk\\src\\var\\theme-color.scss` 文件中,第46-51行的代码:\n```scss\nhtml[theme-color=\"ep-blue\"] {\n --vp-c-brand-1: {getCssVar(\"el-color-primary\")};\n --vp-c-brand-2: {getCssVar(\"el-color-primary-light-3\")};\n --vp-c-brand-3: {getCssVar(\"el-color-primary-light-5\")};\n --v" }, { "url": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV10-ArticlePage文章页.html", "frontmatter": { "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV10-ArticlePage文章页", "date": "2025-08-21 12:05:00", "excerpt": "<p>这一部分来了解一下ArticlePage文章页组件。</p>\n", "capture": "这一部分来了解一下ArticlePage文章页组件。\n<script setup\nimport { MtArticlePage } from \"vitepress-theme-mist\"\n</script>\n 一、page布局\n当在 Markdown 文档将 `frontmatter.layout` 设置为 `page`,VitePress 不会对该 Markdown 生成的文章页应用任何样式,这对于需要创建一个完全自定义的页面时很有用。当没有设置`frontmatter.layout`时,默认使用的是`doc`布局,是这样的:\n当改为page布局,会变成这样:\n 二、文章页" }, { "url": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV09-Segmented分段器.html", "frontmatter": { "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "icon": "material-symbols:segment", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtSegmented 组件提供分段选择功能,支持多种数据类型和自定义配置" }, "title": "LV09-Segmented分段器", "date": "2025-08-20 22:05:00", "excerpt": "", "capture": "<script setup\nimport { MtSegmented, MtSegmentedItem } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst basicValue = ref('option1')\nconst disabledValue = ref('option1')\nconst iconValue = ref(\"ep:coordinate\")\nconst mixedValue = ref('option1')\nconst numberValue = ref(1)\nconst basicOptions" }, { "url": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV08-Popover气泡卡片.html", "frontmatter": { "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "icon": "material-symbols:chat-bubble-outline", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtPopover 组件提供了一个轻量级的弹出框,用于显示额外的信息或操作,支持多种触发方式和定位选项" }, "title": "LV08-Popover气泡卡片", "date": "2025-08-20 20:24:00", "excerpt": "", "capture": "<script setup\nimport { MtPopover, MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 不同触发方式示例\nconst clickVisible = ref(false)\nconst hoverVisible = ref(false)\nconst focusVisible = ref(false)\n// 不同位置示例\nconst topVisible = ref(false)\nconst rightVisible = ref(false)\nconst bottomVisibl" }, { "url": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "relativePath": "/sdoc/02-组件/02-主题组件/LV01-Democode组件.html", "frontmatter": { "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-Democode组件", "date": "2025-08-20 16:37:00", "capture": "Demo 插件与 MtDemoCode 组件分析\n 一、概述\n本文档深入分析 VitePress 主题中的 `demo` 插件 (`packages/markdown/plugins/demo.ts`) 和 `MtDemoCode` 组件 (`packages/components/theme/DemoCode/src/index.vue`)。这两个组件协同工作,实现在 Markdown 文档中嵌入可交互的 Vue 组件示例,并提供源代码查看、复制等功能。\n 二、工作原理总览\n整个流程可以分为以下几个步骤:\n(1)Markdown 解析阶段:VitePress 使用 `demo` 插件解析 M" }, { "url": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV07-Message消息提示.html", "frontmatter": { "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "icon": "material-symbols:notifications", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtMessage 组件提供全局的消息提示功能,支持多种类型和自定义配置" }, "title": "LV07-Message消息提示", "date": "2025-08-19 20:37:00", "excerpt": "", "capture": "<script setup\nimport { MtMessage } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst showMessage = (type = 'info') => {\n MtMessagetype\n}\nconst showCustomMessage = () => {\n MtMessage({\n message: '这是一条自定义消息,持续5秒',\n type: 'success',\n duration: 5000,\n showClose: true,\n " }, { "url": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV06-Button按钮.html", "frontmatter": { "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "icon": "material-symbols:smart-button", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtButton 组件提供基础按钮样式和交互效果,仿照 Element Plus 风格,支持不同主题和尺寸" }, "title": "LV06-Button按钮", "date": "2025-08-19 15:55:00", "excerpt": "", "capture": "<script setup\nimport { MtButton } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\n// 基础示例\nconst basicClickCount = ref(0)\nconst handleBasicClick = () => {\n basicClickCount.value++\n}\n// 不同类型示例\nconst primaryClickCount = ref(0)\nconst handlePrimaryClick = () => {\n primaryClickCount.value" }, { "url": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV05-Icon图标.html", "frontmatter": { "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-Icon 图标", "date": "2025-08-19 09:15:52", "capture": "<!-- 引入 iconfont 在线图标样式 --\n<link rel=\"stylesheet\" href=\"//at.alicdn.com/t/font_2989306_w303erbip9.css\" />\n<script setup lang=\"ts\">\nimport { MtIcon } from \"vitepress-theme-mist\";\nimport { gitee, email, WhatsApp, telegram, github, bilibili, moblieQQ, music } from \"vitepress-theme-mist\";" }, { "url": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV04-InputSlide滑动输入.html", "frontmatter": { "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "icon": "material-symbols:slider", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtInputSlide 组件提供美观的滑动输入控件,支持自定义范围、步长和格式化" }, "title": "LV04-InputSlide滑动输入", "date": "2025-08-18 12:03:00", "excerpt": "", "capture": "<script setup\nimport { MtInputSlide } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst value1 = ref(50) // 基础示例\nconst value2 = ref(100) // 自定义范围示例\nconst value3 = ref(5) // 设置步长示例\nconst value4 = ref(30) // 禁用状态示例\nconst value5 = ref(75) // 自定义格式化示例\nconst formatPercentage = (val) =&g" }, { "url": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV03-TransitionCollapse折叠.html", "frontmatter": { "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "icon": "material-symbols:animation", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": "MtTransitionCollapse 组件提供平滑的折叠展开动画效果" }, "title": "LV03-TransitionCollapse折叠", "date": "2025-08-18 11:37:00", "excerpt": "", "capture": "<script setup\nimport { MtTransitionCollapse } from \"vitepress-theme-mist\"\nimport { ref } from 'vue'\nconst show = ref(false)\n</script>\n<style scoped>\n.preview-container {\n padding: 20px;\n border: 1px solid ddd;\n border-radius: 4px;\n}\n.content {\n padding: 10px;\n background-color:rg" }, { "url": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV02-BackTop回到顶部.html", "frontmatter": { "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-BackTop回到顶部", "date": "2025-08-18 11:15:52", "excerpt": "", "capture": "简介\n这是一个回到顶部按钮。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtBackTop minScrollY=\"value\"/\n```\nminScrollY表示向下滚动多少px后出现回到顶部按钮。\n 效果\n页面向下滚动就可以看到右下角出现轨道顶部按钮了。\n<MtBackTop minScrollY=\"20\"/>" }, { "url": "/sdoc/01-开发/LV04-主题配置.html", "relativePath": "/sdoc/01-开发/LV04-主题配置.html", "frontmatter": { "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV04-主题配置", "date": "2025-08-17 11:49:33", "excerpt": "<p>vitepress的配置合并。</p>\n", "capture": "vitepress的配置合并。\n 一、概述\n当建立一个vitepress站点后,得到的默认配置文件如下:\n```typescript\nimport { defineConfig } from 'vitepress'\n// https://vitepress.dev/reference/site-config\nexport default defineConfig({\n title: \"mist docs\",\n description: \"vitepress-theme-mist docs\",\n themeConfig: {\n // https://vitepress.dev/ref" }, { "url": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "relativePath": "/sdoc/02-组件/01-公共组件/LV01-DataLoader数据加载.html", "frontmatter": { "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-DataLoader数据加载", "date": "2025-08-17 11:15:52", "excerpt": "", "capture": "<script setup\nimport { MtDataLoader } from \"vitepress-theme-mist\"\n</script>\n 简介\n第一个组件,主要是学习组件的写法和用法。\n 基本用法\n在 Markdown文档中添加以下内容:\n```markdown\n<MtDataLoader />\n```\n 效果\n<MtDataLoader />" }, { "url": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "relativePath": "/sdoc/01-开发/LV05-DataLoader组件分析.html", "frontmatter": { "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV05-DataLoader组件分析", "date": "2025-08-17 10:59:28", "capture": "DataLoader 组件导入过程分析\n 概述\n本文档详细分析了 DataLoader 组件在项目中的目录结构、各文件作用以及从组件实现到最终在 `@docs-site/vitepress-theme-mist` 主题中注册的完整导入链路。\n 1. 目录结构分析\n 1.1 目录结构\n```bash\n📁 DataLoader/\n├── 📄 index.ts 组件主入口文件\n├── 📁 src/\n│ ├── 📄 DataLoader.vue 组件实现文件\n│ ├── 📄 DataLoader.ts 类型定" }, { "url": "/sdoc/01-开发/LV03-主题入口分析.html", "relativePath": "/sdoc/01-开发/LV03-主题入口分析.html", "frontmatter": { "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV03-LV01-主题入口分析", "date": "2025-08-16 09:50:28", "capture": "一、开发指南\n主题的主入口文件为`packages/mist/index.ts`,这里的index.ts将会在vitepress站点的`.vitepress/theme/index.ts`中导入和调用。\n 二、Workspace 机制详解\n 1. 项目配置分析\n 1.1 pnpm-workspace.yaml\n```yaml\n pnpm-workspace.yaml\npackages:\n - docs\n - packages/*\n```\n这个配置定义了 Workspace 的范围,包含了 `packages` 目录下的所有子目录。\n 1.2 packages/mist/package.js" }, { "url": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "relativePath": "/sdoc/01-开发/LV02-TS路径映射与包作用域.html", "frontmatter": { "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV02-TS路径映射与包作用域", "date": "2025-08-15 10:50:12", "excerpt": "", "capture": "一、Typescript路径映射\nTypescript 路径映射(Path Mapping)是一种允许开发者在导入模块时使用自定义路径别名而不是相对路径的功能。这使得代码更加清晰、易于维护,并且在重构项目结构时更加方便。\n 1. 基本概念\n路径映射通过在 `tsconfig.json` 文件中配置 `paths` 和 `baseUrl` 来实现。`baseUrl` 指定了非相对路径模块的基础目录,`paths` 则定义了路径别名与实际路径之间的映射关系。\n路径映射的核心价值在于解决深层嵌套目录结构中的导入问题。当项目变得复杂时,相对路径可能会变成类似 `../../../../utils/he" }, { "url": "/sdoc/01-开发/LV01-pnpm工作区.html", "relativePath": "/sdoc/01-开发/LV01-pnpm工作区.html", "frontmatter": { "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "icon": "famicons:logo-markdown", "index": true, "tags": null, "categories": null, "copyright": true, "keywords": null, "cover": null, "comments": null, "mathjax": null, "top": null, "description": null }, "title": "LV01-pnpm的工作区", "date": "2025-08-15 09:50:28", "excerpt": "", "capture": "一、工作区\n\npnpm 内置了对单一存储库(也称为多包存储库、多项目存储库或整体存储库)的支持。你可以创建一个工作区来将多个项目联合到一个存储库中。\n> 工作区的根目录中必须有一个 `pnpm-workspace.yaml` 文件。\n 1. 工作区协议\n如果 linkWorkspacePackages 设置为 `true`,如果可用包与声明的范围匹配,pnpm 将从工作区链接包。例如,如果 `bar` 在其依赖中有 `\"foo\": \"^1.0.0\"` 并且 `foo@1.0.0` 在工作区中,则 `foo@1.0.0` 链接到 `bar`。但是,如果 `bar` 在依赖中有 `\"foo\"" } ] } }, "groupPosts": { "categories": {}, "tags": {} }, "groupCards": { "categories": [], "tags": [] } } }, "locales": {}, "scrollOffset": 134, "cleanUrls": false, "localeIndex": "root" }