mirror of
https://github.com/pengzhanbo/vuepress-theme-plume.git
synced 2026-04-23 10:58:13 +08:00
docs: update skills
This commit is contained in:
pengzhanbo
parent
50fa747ec1
commit
f14d663bb5
@ -7,6 +7,7 @@ export default config({
|
||||
},
|
||||
ignores: [
|
||||
'lib',
|
||||
'skills',
|
||||
'docs/snippet/code-block.snippet.md',
|
||||
'docs/snippet/whitespace.snippet.md',
|
||||
],
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
name: vuepress-plume-config
|
||||
description: Generate and write VuePress Plume theme config. Invoke when user asks to init or update theme config, including collections, navbar, sidebar, locales, plugins, and all theme features like search, comments, watermark, encryption, bulletin, copyright, etc.
|
||||
description: Generate and write VuePress Plume theme config. Invoke when user asks to init or update theme config, including collections, navbar, sidebar, locales, plugins, and all theme features like search, comments, watermark, encryption, bulletin, copyright, llmstxt, replaceAssets, etc.
|
||||
---
|
||||
|
||||
# VuePress Plume Config Skill
|
||||
@ -11,7 +11,7 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
|
||||
- Initialize or update Plume theme configuration
|
||||
- Configure collections (post/doc types), navbar, sidebar, locales
|
||||
- Setup plugins (search, comments, watermark, etc.)
|
||||
- Setup plugins (search, comments, watermark, llmstxt, etc.)
|
||||
- Configure encryption, bulletin, copyright, and other advanced features
|
||||
- Write the generated configuration into a specified target file
|
||||
|
||||
@ -20,7 +20,7 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
- [Theme Configuration](https://theme-plume.vuejs.press/config/theme/)
|
||||
- [Locales Configuration](https://theme-plume.vuejs.press/config/locales/)
|
||||
- [Collections Configuration](https://theme-plume.vuejs.press/config/collections/)
|
||||
- [Navbar](https://theme-plume.vuejs.press/config/navigation/)
|
||||
- [Navbar](https://theme-plume.vuejs.press/config/navbar/)
|
||||
- [Sidebar](https://theme-plume.vuejs.press/config/sidebar/)
|
||||
- [Markdown](https://theme-plume.vuejs.press/config/markdown/)
|
||||
- [Plugins](https://theme-plume.vuejs.press/config/plugins/)
|
||||
@ -29,6 +29,41 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
- [Frontmatter - Home](https://theme-plume.vuejs.press/config/frontmatter/home/)
|
||||
- [Frontmatter - Friend](https://theme-plume.vuejs.press/config/frontmatter/friend/)
|
||||
|
||||
## Configuration Files
|
||||
|
||||
The theme supports two configuration approaches:
|
||||
|
||||
### 1. `.vuepress/config.ts` (Recommended for full control)
|
||||
|
||||
```ts
|
||||
import { defineUserConfig } from 'vuepress'
|
||||
import { plumeTheme } from 'vuepress-theme-plume'
|
||||
|
||||
export default defineUserConfig({
|
||||
// Site-level config: lang, title, description, base, head, locales
|
||||
theme: plumeTheme({
|
||||
// Full theme config available, including plugins, markdown, search, comment, etc.
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
### 2. `.vuepress/plume.config.ts` (Recommended for clean separation)
|
||||
|
||||
```ts
|
||||
import { defineThemeConfig } from 'vuepress-theme-plume'
|
||||
|
||||
export default defineThemeConfig({
|
||||
// Supported fields: hostname, home, logo, logoDark, appearance, profile, social,
|
||||
// navbarSocialInclude, navbar, collections, sidebar, sidebarScrollbar, aside, outline,
|
||||
// transition, footer, bulletin, copyright, prevPage, nextPage, createTime, locales,
|
||||
// docsRepo/docsBranch/docsDir, autoFrontmatter, editLinkPattern
|
||||
})
|
||||
```
|
||||
|
||||
::: warning Fields NOT supported in `plume.config.ts`
|
||||
`plugins`, `markdown`, `codeHighlighter`, `search`, `comment`, `watermark`, `readingTime`, `copyCode`, `replaceAssets`, `editLink`, `lastUpdated`, `contributors`, `changelog`, `cache`, `hostname`, `configFile`, `encrypt`, `llmstxt`
|
||||
:::
|
||||
|
||||
## Input Schema
|
||||
|
||||
```json
|
||||
@ -49,93 +84,72 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
"type": "object",
|
||||
"description": "VuePress site-level config (config.ts/js only)",
|
||||
"properties": {
|
||||
"lang": { "type": "string", "description": "Default language, e.g., 'zh-CN', 'en-US'", "default": "zh-CN" },
|
||||
"title": { "type": "string", "description": "Site title" },
|
||||
"description": { "type": "string", "description": "Site description" },
|
||||
"base": { "type": "string", "description": "Deployment base path like /subpath/" },
|
||||
"head": { "type": "array", "description": "Extra <head> tags", "items": { "type": "array" } },
|
||||
"locales": {
|
||||
"type": "object",
|
||||
"description": "Site locales (config.ts/js only)",
|
||||
"additionalProperties": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"lang": { "type": "string" },
|
||||
"title": { "type": "string" },
|
||||
"description": { "type": "string" }
|
||||
}
|
||||
}
|
||||
}
|
||||
"lang": { "type": "string", "default": "zh-CN" },
|
||||
"title": { "type": "string" },
|
||||
"description": { "type": "string" },
|
||||
"base": { "type": "string" },
|
||||
"head": { "type": "array" },
|
||||
"locales": { "type": "object" }
|
||||
}
|
||||
},
|
||||
"theme": {
|
||||
"type": "object",
|
||||
"description": "Plume theme configuration (themeConfig)",
|
||||
"description": "Plume theme configuration",
|
||||
"properties": {
|
||||
"hostname": { "type": "string", "default": "", "description": "Deployment hostname (for sitemap/SEO). Not supported in plume.config.ts" },
|
||||
"configFile": { "type": "string", "default": "", "description": "Custom theme config file path. Not supported in plume.config.ts" },
|
||||
"hostname": { "type": "string", "default": "" },
|
||||
"configFile": { "type": "string", "default": "" },
|
||||
"autoFrontmatter": {
|
||||
"type": ["object", "boolean"],
|
||||
"default": { "permalink": true, "createTime": true, "title": true },
|
||||
"properties": {
|
||||
"permalink": { "type": ["boolean", "string"], "default": true, "description": "true|false|'filepath'" },
|
||||
"permalink": { "type": ["boolean", "string"], "default": true },
|
||||
"createTime": { "type": "boolean", "default": true },
|
||||
"title": { "type": "boolean", "default": true }
|
||||
},
|
||||
"description": "Automatically add frontmatter to Markdown"
|
||||
}
|
||||
},
|
||||
"cache": {
|
||||
"type": ["string", "boolean"],
|
||||
"enum": ["memory", "filesystem", false],
|
||||
"default": "filesystem",
|
||||
"description": "Compilation cache: 'memory', 'filesystem', or false. Not supported in plume.config.ts"
|
||||
"default": "filesystem"
|
||||
},
|
||||
"docsRepo": { "type": "string", "default": "", "description": "Docs repository url for edit link" },
|
||||
"docsBranch": { "type": "string", "default": "", "description": "Docs repository branch" },
|
||||
"docsDir": { "type": "string", "default": "", "description": "Docs directory (relative to repo root)" },
|
||||
"editLink": { "type": "boolean", "default": true, "description": "Enable edit link. Not supported in plume.config.ts" },
|
||||
"editLinkPattern": { "type": "string", "default": "", "description": "Edit link pattern, e.g., ':repo/edit/:branch/:path'" },
|
||||
"docsRepo": { "type": "string", "default": "" },
|
||||
"docsBranch": { "type": "string", "default": "" },
|
||||
"docsDir": { "type": "string", "default": "" },
|
||||
"editLink": { "type": "boolean", "default": true },
|
||||
"editLinkPattern": { "type": "string", "default": "" },
|
||||
"lastUpdated": {
|
||||
"type": ["object", "boolean"],
|
||||
"default": { "formatOptions": { "dateStyle": "short", "timeStyle": "short" } },
|
||||
"properties": {
|
||||
"formatOptions": { "type": "object", "description": "Intl.DateTimeFormatOptions & { forceLocale?: boolean }" }
|
||||
},
|
||||
"description": "Last updated time. Not supported in plume.config.ts"
|
||||
"default": { "formatOptions": { "dateStyle": "short", "timeStyle": "short" } }
|
||||
},
|
||||
"contributors": { "type": ["boolean", "object"], "default": true, "description": "Show contributors. Not supported in plume.config.ts" },
|
||||
"changelog": { "type": ["boolean", "object"], "default": false, "description": "Show page change history. Not supported in plume.config.ts" },
|
||||
"home": { "type": ["string", "boolean"], "default": "/", "description": "Home path" },
|
||||
"logo": { "type": ["string", "boolean"], "default": false, "description": "Navbar logo" },
|
||||
"logoDark": { "type": ["string", "boolean"], "default": false, "description": "Navbar logo for dark mode" },
|
||||
"contributors": { "type": ["boolean", "object"], "default": true },
|
||||
"changelog": { "type": ["boolean", "object"], "default": false },
|
||||
"home": { "type": ["string", "boolean"], "default": "/" },
|
||||
"logo": { "type": ["string", "boolean"], "default": false },
|
||||
"logoDark": { "type": ["string", "boolean"], "default": false },
|
||||
"appearance": {
|
||||
"type": ["string", "boolean"],
|
||||
"enum": [true, false, "dark", "force-dark"],
|
||||
"default": true,
|
||||
"description": "Dark mode: true (auto), false (disabled), 'dark' (default dark), 'force-dark' (forced dark)"
|
||||
"default": true
|
||||
},
|
||||
"profile": {
|
||||
"type": "object",
|
||||
"default": {},
|
||||
"description": "Site profile info for blogger display",
|
||||
"properties": {
|
||||
"avatar": { "type": "string", "description": "Avatar URL" },
|
||||
"name": { "type": "string", "description": "Blogger name" },
|
||||
"description": { "type": "string", "description": "Description/motto" },
|
||||
"circle": { "type": "boolean", "description": "Circle avatar" },
|
||||
"location": { "type": "string", "description": "User location" },
|
||||
"organization": { "type": "string", "description": "User organization/company" },
|
||||
"avatar": { "type": "string" },
|
||||
"name": { "type": "string" },
|
||||
"description": { "type": "string" },
|
||||
"circle": { "type": "boolean" },
|
||||
"location": { "type": "string" },
|
||||
"organization": { "type": "string" },
|
||||
"layout": { "type": "string", "enum": ["left", "right"], "default": "right" }
|
||||
}
|
||||
},
|
||||
"social": {
|
||||
"type": ["array", "boolean"],
|
||||
"default": false,
|
||||
"description": "Social links (Iconify name or custom SVG)",
|
||||
"items": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"icon": { "type": ["string", "object"], "description": "Iconify name or { svg: string, name?: string }" },
|
||||
"icon": { "type": ["string", "object"] },
|
||||
"link": { "type": "string" },
|
||||
"ariaLabel": { "type": "string" }
|
||||
},
|
||||
@ -145,23 +159,21 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
"navbarSocialInclude": {
|
||||
"type": "array",
|
||||
"default": ["github", "twitter", "discord", "facebook"],
|
||||
"items": { "type": "string" },
|
||||
"description": "Social links allowed to display in navbar (PC only)"
|
||||
"items": { "type": "string" }
|
||||
},
|
||||
"navbar": {
|
||||
"type": "array",
|
||||
"default": [],
|
||||
"description": "Navbar configuration",
|
||||
"items": {
|
||||
"type": ["string", "object"],
|
||||
"properties": {
|
||||
"text": { "type": "string" },
|
||||
"link": { "type": "string" },
|
||||
"prefix": { "type": "string", "description": "Page prefix for group" },
|
||||
"items": { "type": "array", "description": "Nested nav items (max depth 2)" },
|
||||
"icon": { "type": ["string", "object"], "description": "Iconify icon or { svg: string }" },
|
||||
"badge": { "type": ["string", "object"], "description": "Badge text or { text, type, color, bgColor, borderColor }" },
|
||||
"activeMatch": { "type": "string", "description": "Regex pattern for active state" }
|
||||
"prefix": { "type": "string" },
|
||||
"items": { "type": "array" },
|
||||
"icon": { "type": ["string", "object"] },
|
||||
"badge": { "type": ["string", "object"] },
|
||||
"activeMatch": { "type": "string" }
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -173,69 +185,53 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
"type": "object",
|
||||
"required": ["type", "dir", "title"],
|
||||
"properties": {
|
||||
"type": { "type": "string", "enum": ["post", "doc"], "description": "Collection type" },
|
||||
"dir": { "type": "string", "description": "Directory relative to source" },
|
||||
"title": { "type": "string", "description": "Collection title for breadcrumb" },
|
||||
"linkPrefix": { "type": "string", "description": "Article link prefix" },
|
||||
"type": { "type": "string", "enum": ["post", "doc"] },
|
||||
"dir": { "type": "string" },
|
||||
"title": { "type": "string" },
|
||||
"linkPrefix": { "type": "string" },
|
||||
"tagsTheme": { "type": "string", "enum": ["colored", "gray", "brand"], "default": "colored" },
|
||||
"autoFrontmatter": { "type": ["object", "boolean"] },
|
||||
"include": { "type": "array", "items": { "type": "string" }, "description": "Glob patterns for included files" },
|
||||
"exclude": { "type": "array", "items": { "type": "string" }, "description": "Glob patterns for excluded files" },
|
||||
"pagination": {
|
||||
"type": ["boolean", "number", "object"],
|
||||
"properties": { "perPage": { "type": "number", "default": 15 } }
|
||||
},
|
||||
"link": { "type": "string", "description": "Post list page link" },
|
||||
"postList": { "type": "boolean", "default": true, "description": "Enable post list page (post type only)" },
|
||||
"tags": { "type": "boolean", "default": true, "description": "Enable tags page (post type only)" },
|
||||
"include": { "type": "array", "items": { "type": "string" } },
|
||||
"exclude": { "type": "array", "items": { "type": "string" } },
|
||||
"pagination": { "type": ["boolean", "number", "object"] },
|
||||
"link": { "type": "string" },
|
||||
"postList": { "type": "boolean", "default": true },
|
||||
"tags": { "type": "boolean", "default": true },
|
||||
"tagsLink": { "type": "string" },
|
||||
"tagsText": { "type": "string" },
|
||||
"archives": { "type": "boolean", "default": true, "description": "Enable archives page (post type only)" },
|
||||
"archives": { "type": "boolean", "default": true },
|
||||
"archivesLink": { "type": "string" },
|
||||
"archivesText": { "type": "string" },
|
||||
"categories": { "type": "boolean", "default": true, "description": "Enable categories (post type only)" },
|
||||
"categories": { "type": "boolean", "default": true },
|
||||
"categoriesLink": { "type": "string" },
|
||||
"categoriesText": { "type": "string" },
|
||||
"categoriesExpand": { "type": ["number", "string"], "enum": ["deep"], "default": "deep" },
|
||||
"categoriesTransform": { "type": "string", "description": "Function name for categories transform" },
|
||||
"postCover": {
|
||||
"type": ["string", "object"],
|
||||
"description": "Post cover layout/style",
|
||||
"properties": {
|
||||
"layout": { "type": "string", "enum": ["left", "right", "odd-left", "odd-right", "top"] },
|
||||
"ratio": { "type": ["number", "string"], "description": "Aspect ratio like '16:9' or number" },
|
||||
"width": { "type": "number", "default": 240 },
|
||||
"compact": { "type": "boolean", "default": false }
|
||||
}
|
||||
},
|
||||
"profile": { "type": ["object", "boolean"], "description": "Profile config for this collection" },
|
||||
"social": { "type": ["array", "boolean"], "description": "Social links for this collection" },
|
||||
"sidebar": { "type": ["string", "array"], "description": "Doc type only: 'auto' or sidebar config" },
|
||||
"categoriesExpand": { "type": ["number", "string"], "default": "deep" },
|
||||
"categoriesTransform": { "type": "string" },
|
||||
"postCover": { "type": ["string", "object"] },
|
||||
"profile": { "type": ["object", "boolean"] },
|
||||
"social": { "type": ["array", "boolean"] },
|
||||
"sidebar": { "type": ["string", "array"] },
|
||||
"sidebarScrollbar": { "type": "boolean", "default": true },
|
||||
"sidebarCollapsed": { "type": "boolean", "default": false }
|
||||
}
|
||||
}
|
||||
},
|
||||
"sidebar": {
|
||||
"type": ["object", "boolean"],
|
||||
"description": "Global sidebar (prefer configuring in collections)"
|
||||
},
|
||||
"sidebar": { "type": ["object", "boolean"] },
|
||||
"sidebarScrollbar": { "type": "boolean", "default": true },
|
||||
"aside": { "type": ["boolean", "string"], "enum": [true, false, "left"], "default": true, "description": "Right sidebar/outline display" },
|
||||
"outline": { "type": ["boolean", "number", "array", "string"], "default": [2, 3], "description": "false|n|[min,max]|'deep'" },
|
||||
"aside": { "type": ["boolean", "string"], "enum": [true, false, "left"], "default": true },
|
||||
"outline": { "type": ["boolean", "number", "array", "string"], "default": [2, 3] },
|
||||
"transition": {
|
||||
"type": ["boolean", "object"],
|
||||
"default": true,
|
||||
"properties": {
|
||||
"page": { "type": "boolean", "default": true, "description": "Page transition animation" },
|
||||
"postList": { "type": "boolean", "default": true, "description": "Post list transition animation" },
|
||||
"appearance": { "type": ["boolean", "string"], "default": "fade", "description": "Theme switch animation: fade, circle-clip, horizontal-clip, vertical-clip, skew-clip, blinds-vertical, blinds-horizontal, soft-blur-fade, diamond-reveal" }
|
||||
"page": { "type": "boolean", "default": true },
|
||||
"postList": { "type": "boolean", "default": true },
|
||||
"appearance": { "type": ["boolean", "string"], "default": "fade" }
|
||||
}
|
||||
},
|
||||
"footer": {
|
||||
"type": ["boolean", "object"],
|
||||
"default": false,
|
||||
"description": "Footer config",
|
||||
"properties": {
|
||||
"message": { "type": "string" },
|
||||
"copyright": { "type": "string" }
|
||||
@ -244,102 +240,47 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
"bulletin": {
|
||||
"type": ["boolean", "object"],
|
||||
"default": false,
|
||||
"description": "Bulletin/announcement board config",
|
||||
"properties": {
|
||||
"layout": { "type": "string", "enum": ["top-left", "top-right", "bottom-left", "bottom-right", "center"], "default": "top-right" },
|
||||
"border": { "type": "boolean", "default": true },
|
||||
"enablePage": { "type": ["boolean", "string"], "description": "Boolean or function name" },
|
||||
"enablePage": { "type": ["boolean", "string"] },
|
||||
"lifetime": { "type": "string", "enum": ["session", "always", "once"], "default": "always" },
|
||||
"id": { "type": "string", "description": "Bulletin unique ID" },
|
||||
"id": { "type": "string" },
|
||||
"title": { "type": "string" },
|
||||
"content": { "type": "string" },
|
||||
"contentType": { "type": "string", "enum": ["markdown", "text"], "default": "text" },
|
||||
"contentFile": { "type": "string", "description": "Path to markdown/html file" }
|
||||
"contentFile": { "type": "string" }
|
||||
}
|
||||
},
|
||||
"copyright": {
|
||||
"type": ["boolean", "string", "object"],
|
||||
"default": false,
|
||||
"description": "Copyright config: true (CC-BY-4.0), license string, or object",
|
||||
"properties": {
|
||||
"license": { "type": ["string", "object"], "description": "License: CC-BY-4.0, CC-BY-SA-4.0, CC-BY-NC-4.0, CC-BY-NC-SA-4.0, CC-BY-ND-4.0, CC-BY-NC-ND-4.0, CC0, or { name, url }" },
|
||||
"author": { "type": ["string", "object"], "description": "Author name or { name, url }" },
|
||||
"license": { "type": ["string", "object"] },
|
||||
"author": { "type": ["string", "object"] },
|
||||
"creation": { "type": "string", "enum": ["original", "translate", "reprint"], "default": "original" }
|
||||
}
|
||||
},
|
||||
"prevPage": { "type": "boolean", "default": true, "description": "Show previous page link" },
|
||||
"nextPage": { "type": "boolean", "default": true, "description": "Show next page link" },
|
||||
"createTime": { "type": ["boolean", "string"], "enum": [true, false, "only-posts"], "default": true, "description": "Show create time" },
|
||||
"locales": {
|
||||
"type": "object",
|
||||
"description": "Theme locales (texts and per-locale theme config)",
|
||||
"additionalProperties": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"selectLanguageName": { "type": "string" },
|
||||
"selectLanguageText": { "type": "string" },
|
||||
"selectLanguageAriaLabel": { "type": "string" },
|
||||
"appearanceText": { "type": "string" },
|
||||
"homeText": { "type": "string" },
|
||||
"postsText": { "type": "string" },
|
||||
"tagText": { "type": "string" },
|
||||
"categoryText": { "type": "string" },
|
||||
"archiveText": { "type": "string" },
|
||||
"archiveTotalText": { "type": "string" },
|
||||
"sidebarMenuLabel": { "type": "string" },
|
||||
"returnToTopLabel": { "type": "string" },
|
||||
"outlineLabel": { "type": "string" },
|
||||
"editLinkText": { "type": "string" },
|
||||
"latestUpdatedText": { "type": "string" },
|
||||
"contributorsText": { "type": "string" },
|
||||
"changelogText": { "type": "string" },
|
||||
"changelogOnText": { "type": "string" },
|
||||
"changelogButtonText": { "type": "string" },
|
||||
"copyrightText": { "type": "string" },
|
||||
"copyrightAuthorText": { "type": "string" },
|
||||
"copyrightCreationOriginalText": { "type": "string" },
|
||||
"copyrightCreationTranslateText": { "type": "string" },
|
||||
"copyrightCreationReprintText": { "type": "string" },
|
||||
"copyrightLicenseText": { "type": "string" },
|
||||
"prevPageLabel": { "type": "string" },
|
||||
"nextPageLabel": { "type": "string" },
|
||||
"encryptGlobalText": { "type": "string" },
|
||||
"encryptPageText": { "type": "string" },
|
||||
"encryptButtonText": { "type": "string" },
|
||||
"encryptPlaceholder": { "type": "string" },
|
||||
"notFound": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"code": { "type": "string" },
|
||||
"title": { "type": "string" },
|
||||
"quote": { "type": "string" },
|
||||
"linkLabel": { "type": "string" },
|
||||
"linkText": { "type": "string" }
|
||||
}
|
||||
},
|
||||
"collections": { "type": "array" }
|
||||
}
|
||||
}
|
||||
},
|
||||
"plugins": {
|
||||
"type": "object",
|
||||
"description": "Built-in plugin options. Not supported in plume.config.ts"
|
||||
},
|
||||
"markdown": { "type": "object", "description": "Markdown options. Not supported in plume.config.ts" },
|
||||
"codeHighlighter": { "type": ["object", "boolean"], "description": "Code highlighter options. Not supported in plume.config.ts" },
|
||||
"search": { "type": ["object", "boolean"], "description": "Search config: { provider: 'local'|'algolia', ...options }. Not supported in plume.config.ts" },
|
||||
"comment": { "type": ["object", "boolean"], "description": "Comments config: { provider: 'Giscus'|'Waline'|'Twikoo'|'Artalk', ...options }. Not supported in plume.config.ts" },
|
||||
"watermark": { "type": ["object", "boolean"], "description": "Watermark config. Not supported in plume.config.ts" },
|
||||
"readingTime": { "type": ["object", "boolean"], "description": "Reading time config. Not supported in plume.config.ts" },
|
||||
"copyCode": { "type": ["object", "boolean"], "description": "Copy code config. Not supported in plume.config.ts" },
|
||||
"replaceAssets": { "type": ["object", "boolean"], "description": "Replace assets config. Not supported in plume.config.ts" },
|
||||
"prevPage": { "type": "boolean", "default": true },
|
||||
"nextPage": { "type": "boolean", "default": true },
|
||||
"createTime": { "type": ["boolean", "string"], "enum": [true, false, "only-posts"], "default": true },
|
||||
"locales": { "type": "object" },
|
||||
"plugins": { "type": "object" },
|
||||
"markdown": { "type": "object" },
|
||||
"codeHighlighter": { "type": ["object", "boolean"] },
|
||||
"search": { "type": ["object", "boolean"] },
|
||||
"comment": { "type": ["object", "boolean"] },
|
||||
"watermark": { "type": ["object", "boolean"] },
|
||||
"readingTime": { "type": ["object", "boolean"] },
|
||||
"copyCode": { "type": ["object", "boolean"] },
|
||||
"replaceAssets": { "type": ["object", "boolean"] },
|
||||
"llmstxt": { "type": ["object", "boolean"] },
|
||||
"encrypt": {
|
||||
"type": ["object", "boolean"],
|
||||
"description": "Encryption config. Not supported in plume.config.ts",
|
||||
"properties": {
|
||||
"global": { "type": "boolean", "default": false, "description": "Enable global site encryption" },
|
||||
"admin": { "type": "array", "items": { "type": "string" }, "description": "Admin passwords" },
|
||||
"rules": { "type": "object", "description": "Path-based encryption rules: { 'path/or/pattern': 'password' | ['password1', 'password2'] }" }
|
||||
"global": { "type": "boolean", "default": false },
|
||||
"admin": { "type": "array", "items": { "type": "string" } },
|
||||
"rules": { "type": "object" }
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -348,57 +289,324 @@ This skill generates, manages, and writes VuePress Plume theme configuration fil
|
||||
}
|
||||
```
|
||||
|
||||
## Execution Logic
|
||||
## Collections Configuration
|
||||
|
||||
- Parse input and validate `format` and fields
|
||||
- If `format=plume-config-ts`:
|
||||
- Only write fields supported in `.vuepress/plume.config.ts` (ignore and report fields like `plugins`, `markdown`, `search`, `comment`, `watermark`, `encrypt`, etc.)
|
||||
- Generate `defineThemeConfig({ ...theme })`
|
||||
- If `format=vuepress-config-ts`:
|
||||
- Generate `defineUserConfig({ site..., theme: plumeTheme({ ...theme }) })`
|
||||
- If `format=vuepress-config-js`:
|
||||
- Generate equivalent JavaScript version (remove types and `import type`)
|
||||
- Write generated text to `target_file` (create parent dirs if missing)
|
||||
- Output feedback: path, format, field summary, and ignored fields
|
||||
Collections are the core concept for organizing content. Each collection points to a specific folder in the source directory.
|
||||
|
||||
## Templates
|
||||
|
||||
### plume.config.ts
|
||||
### Post Collection (Blog, Columns)
|
||||
|
||||
```ts
|
||||
import { defineThemeConfig } from 'vuepress-theme-plume'
|
||||
|
||||
export default defineThemeConfig({
|
||||
// Supported fields in plume.config.ts: hostname, home, logo, logoDark, appearance, profile, social,
|
||||
// navbarSocialInclude, navbar, collections, sidebar, sidebarScrollbar, aside, outline, transition,
|
||||
// footer, bulletin, copyright, prevPage, nextPage, createTime, locales, docsRepo/docsBranch/docsDir,
|
||||
// autoFrontmatter, editLinkPattern
|
||||
})
|
||||
{
|
||||
type: 'post',
|
||||
dir: 'blog',
|
||||
title: '博客',
|
||||
link: '/blog/',
|
||||
linkPrefix: '/article/',
|
||||
postCover: 'top', // 'left' | 'right' | 'odd-left' | 'odd-right' | 'top'
|
||||
tags: true,
|
||||
archives: true,
|
||||
categories: true,
|
||||
pagination: { perPage: 15 },
|
||||
profile: { name: '博主', avatar: '/avatar.png' },
|
||||
social: [{ icon: 'github', link: 'https://github.com/username' }]
|
||||
}
|
||||
```
|
||||
|
||||
### .vuepress/config.ts
|
||||
### Doc Collection (Documentation, Notes)
|
||||
|
||||
```ts
|
||||
import { defineUserConfig } from 'vuepress'
|
||||
import { plumeTheme } from 'vuepress-theme-plume'
|
||||
{
|
||||
type: 'doc',
|
||||
dir: 'guide',
|
||||
title: '指南',
|
||||
sidebar: 'auto', // or manual sidebar config
|
||||
sidebarScrollbar: true,
|
||||
sidebarCollapsed: false
|
||||
}
|
||||
```
|
||||
|
||||
## Built-in Plugins
|
||||
|
||||
The theme includes these plugins (configured in `plugins` field):
|
||||
|
||||
| Plugin | Description |
|
||||
|--------|-------------|
|
||||
| `@vuepress/plugin-nprogress` | Page loading progress bar |
|
||||
| `@vuepress/plugin-photo-swipe` | Image preview |
|
||||
| `@vuepress/plugin-reading-time` | Article reading time |
|
||||
| `@vuepress/plugin-watermark` | Article watermark |
|
||||
| `@vuepress-plume/plugin-search` | Local search |
|
||||
| `@vuepress/plugin-docsearch` | Algolia DocSearch |
|
||||
| `@vuepress/plugin-copy-code` | Code copy |
|
||||
| `@vuepress/plugin-shiki` | Code highlighting |
|
||||
| `@vuepress/plugin-comment` | Article comments |
|
||||
| `@vuepress/plugin-markdown-hint` | Markdown hints |
|
||||
| `@vuepress/plugin-markdown-image` | Markdown image |
|
||||
| `@vuepress/plugin-markdown-math` | Markdown math |
|
||||
| `@vuepress/plugin-markdown-include` | Markdown include |
|
||||
| `@vuepress/plugin-markdown-chart` | Markdown charts (chartjs/echarts/mermaid/flowchart/markmap/plantuml) |
|
||||
| `@vuepress/plugin-replace-assets` | Asset link replacement |
|
||||
| `vuepress-plugin-md-power` | Markdown Power |
|
||||
| `@vuepress/plugin-git` | Git commit info |
|
||||
| `@vuepress/plugin-cache` | Page compilation cache |
|
||||
| `@vuepress/plugin-seo` | SEO optimization |
|
||||
| `@vuepress/plugin-sitemap` | Sitemap |
|
||||
| `@vuepress/plugin-llms` | LLMs txt support |
|
||||
|
||||
## Markdown Configuration
|
||||
|
||||
Configure markdown features in `markdown` field:
|
||||
|
||||
```ts
|
||||
markdown: {
|
||||
hint: true, // Info, tip, warning, caution containers
|
||||
alert: true, // GitHub-style alerts
|
||||
fileTree: true, // File tree container
|
||||
plot: true, // Hidden text (spoiler)
|
||||
icons: true, // Icons support
|
||||
math: { type: 'katex' }, // Math formulas
|
||||
include: true, // Include markdown files
|
||||
annotation: false, // Inline annotations
|
||||
abbr: false, // Abbreviations
|
||||
mark: 'eager', // Mark/highlight text
|
||||
codeTabs: true, // Code block tabs
|
||||
tabs: true, // General tabs
|
||||
npmTo: false, // npm/yarn/pnpm switcher
|
||||
timeline: false, // Timeline container
|
||||
collapse: false, // Collapsible sections
|
||||
chat: false, // Chat dialog
|
||||
demo: false, // Demo container
|
||||
pdf: false, // PDF embed
|
||||
bilibili: false, // Bilibili video
|
||||
youtube: false, // YouTube video
|
||||
artPlayer: false, // ArtPlayer video
|
||||
audioReader: false,// Audio
|
||||
codepen: false, // CodePen
|
||||
codeSandbox: false,// CodeSandbox
|
||||
jsfiddle: false, // JSFiddle
|
||||
repl: false, // REPL
|
||||
caniuse: false, // Can I Use embed
|
||||
imageSize: false, // Auto image dimensions
|
||||
chartjs: false, // Chart.js
|
||||
echarts: false, // ECharts
|
||||
mermaid: false, // Mermaid
|
||||
markmap: false, // Markmap
|
||||
plantuml: false, // PlantUML
|
||||
flowchart: false, // Flowchart
|
||||
}
|
||||
```
|
||||
|
||||
## Code Highlighter Configuration
|
||||
|
||||
```ts
|
||||
codeHighlighter: {
|
||||
lineNumbers: true, // Enable line numbers globally
|
||||
whitespace: false, // Show whitespace globally
|
||||
collapsedLines: false, // Collapse lines globally
|
||||
theme: { light: 'github-light', dark: 'github-dark' },
|
||||
languages: ['js', 'ts', 'vue', 'bash', 'json'],
|
||||
twoslash: false, // TypeScript twoslash
|
||||
}
|
||||
```
|
||||
|
||||
## Search Configuration
|
||||
|
||||
### Local Search (Default)
|
||||
|
||||
```ts
|
||||
search: {
|
||||
provider: 'local',
|
||||
// Additional options...
|
||||
}
|
||||
```
|
||||
|
||||
### Algolia DocSearch
|
||||
|
||||
```ts
|
||||
search: {
|
||||
provider: 'algolia',
|
||||
appId: 'YOUR_APP_ID',
|
||||
apiKey: 'YOUR_API_KEY',
|
||||
indexName: 'YOUR_INDEX_NAME'
|
||||
}
|
||||
```
|
||||
|
||||
## Comments Configuration
|
||||
|
||||
### Giscus
|
||||
|
||||
```ts
|
||||
comment: {
|
||||
provider: 'Giscus',
|
||||
repo: 'owner/repo',
|
||||
repoId: '...',
|
||||
category: 'Announcements',
|
||||
categoryId: '...'
|
||||
}
|
||||
```
|
||||
|
||||
### Waline
|
||||
|
||||
```ts
|
||||
comment: {
|
||||
provider: 'Waline',
|
||||
serverURL: 'https://your-waline-server.vercel.app'
|
||||
}
|
||||
```
|
||||
|
||||
### Twikoo
|
||||
|
||||
```ts
|
||||
comment: {
|
||||
provider: 'Twikoo',
|
||||
envId: 'your-env-id'
|
||||
}
|
||||
```
|
||||
|
||||
### Artalk
|
||||
|
||||
```ts
|
||||
comment: {
|
||||
provider: 'Artalk',
|
||||
server: 'https://your-artalk-server.com'
|
||||
}
|
||||
```
|
||||
|
||||
## LLMs txt Configuration
|
||||
|
||||
Generate LLM-friendly content for AI assistants:
|
||||
|
||||
```ts
|
||||
llmstxt: {
|
||||
locale: '/',
|
||||
// Additional options...
|
||||
}
|
||||
```
|
||||
|
||||
This generates:
|
||||
- `/llms.txt` - Brief overview with links
|
||||
- `/llms-full.txt` - Full content
|
||||
- Individual markdown files for each page
|
||||
|
||||
## Encryption Configuration
|
||||
|
||||
### Global Encryption
|
||||
|
||||
```ts
|
||||
encrypt: {
|
||||
global: true,
|
||||
admin: ['password1', 'password2']
|
||||
}
|
||||
```
|
||||
|
||||
### Partial Encryption
|
||||
|
||||
```ts
|
||||
encrypt: {
|
||||
rules: {
|
||||
'secret/': 'password',
|
||||
'/article/secret/': ['pass1', 'pass2'],
|
||||
'^/private/': 'private-pass' // Regex pattern
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Watermark Configuration
|
||||
|
||||
```ts
|
||||
watermark: {
|
||||
enabled: true,
|
||||
content: 'Your Name',
|
||||
opacity: 0.1,
|
||||
zIndex: 999
|
||||
}
|
||||
```
|
||||
|
||||
## Replace Assets Configuration
|
||||
|
||||
Replace asset URLs for CDN deployment:
|
||||
|
||||
```ts
|
||||
replaceAssets: {
|
||||
image: 'https://cdn.example.com/images/',
|
||||
js: 'https://cdn.example.com/js/'
|
||||
}
|
||||
```
|
||||
|
||||
## Common Configuration Patterns
|
||||
|
||||
### Blog Setup
|
||||
|
||||
```ts
|
||||
export default defineUserConfig({
|
||||
// Optional site-level config: lang, title, description, base, head, locales
|
||||
theme: plumeTheme({
|
||||
// Full theme config available, including plugins/markdown/search/comment/watermark/encrypt etc.
|
||||
collections: [
|
||||
{
|
||||
type: 'post',
|
||||
dir: 'blog',
|
||||
title: '博客',
|
||||
link: '/blog/',
|
||||
postCover: 'right',
|
||||
tags: true,
|
||||
archives: true,
|
||||
categories: true
|
||||
}
|
||||
],
|
||||
profile: {
|
||||
name: '博主名称',
|
||||
description: '博主描述',
|
||||
avatar: '/avatar.png'
|
||||
},
|
||||
social: [
|
||||
{ icon: 'github', link: 'https://github.com/username' }
|
||||
]
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
### .vuepress/config.js
|
||||
### Documentation Setup
|
||||
|
||||
```js
|
||||
const { defineUserConfig } = require('vuepress')
|
||||
const { plumeTheme } = require('vuepress-theme-plume')
|
||||
|
||||
module.exports = defineUserConfig({
|
||||
```ts
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
// Same as TS version
|
||||
collections: [
|
||||
{
|
||||
type: 'doc',
|
||||
dir: 'guide',
|
||||
title: '指南',
|
||||
sidebar: 'auto'
|
||||
}
|
||||
],
|
||||
navbar: [
|
||||
{ text: '指南', link: '/guide/', icon: 'mdi:book-open-outline' }
|
||||
]
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
### Multi-language Setup
|
||||
|
||||
```ts
|
||||
export default defineUserConfig({
|
||||
locales: {
|
||||
'/': { lang: 'zh-CN', title: '中文站点' },
|
||||
'/en/': { lang: 'en-US', title: 'English Site' }
|
||||
},
|
||||
theme: plumeTheme({
|
||||
locales: {
|
||||
'/': {
|
||||
selectLanguageName: '简体中文',
|
||||
collections: [
|
||||
{ type: 'doc', dir: 'guide', title: '指南', sidebar: 'auto' }
|
||||
]
|
||||
},
|
||||
'/en/': {
|
||||
selectLanguageName: 'English',
|
||||
collections: [
|
||||
{ type: 'doc', dir: 'en/guide', title: 'Guide', sidebar: 'auto' }
|
||||
]
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
```
|
||||
@ -407,7 +615,7 @@ module.exports = defineUserConfig({
|
||||
|
||||
- Check consistency between `format` and `target_file` extension
|
||||
- If `format=plume-config-ts` and input contains fields only supported in config.ts/js:
|
||||
- Exclude these fields from output: `plugins`, `markdown`, `codeHighlighter`, `search`, `comment`, `watermark`, `readingTime`, `copyCode`, `replaceAssets`, `editLink`, `lastUpdated`, `contributors`, `changelog`, `cache`, `hostname`, `configFile`, `encrypt`
|
||||
- Exclude these fields: `plugins`, `markdown`, `codeHighlighter`, `search`, `comment`, `watermark`, `readingTime`, `copyCode`, `replaceAssets`, `editLink`, `lastUpdated`, `contributors`, `changelog`, `cache`, `hostname`, `configFile`, `encrypt`, `llmstxt`
|
||||
- Report them as ignored with reasons
|
||||
- In `collections`, `type` must be `post` or `doc`; `dir` and `title` are required
|
||||
- `navbar` accepts strings (paths) and objects (with `text/link`)
|
||||
@ -415,137 +623,6 @@ module.exports = defineUserConfig({
|
||||
- For `encrypt.rules`, keys can be: file paths, directory paths, URL paths, or regex patterns (starting with `^`)
|
||||
- For `copyright`, support both preset licenses (CC-BY-4.0, etc.) and custom { name, url } format
|
||||
|
||||
## Common Configuration Patterns
|
||||
|
||||
### Blog Setup
|
||||
|
||||
```json
|
||||
{
|
||||
"collections": [
|
||||
{
|
||||
"type": "post",
|
||||
"dir": "blog",
|
||||
"title": "博客",
|
||||
"link": "/blog/",
|
||||
"postCover": "right",
|
||||
"tags": true,
|
||||
"archives": true,
|
||||
"categories": true
|
||||
}
|
||||
],
|
||||
"profile": {
|
||||
"name": "博主名称",
|
||||
"description": "博主描述",
|
||||
"avatar": "/avatar.png"
|
||||
},
|
||||
"social": [
|
||||
{ "icon": "github", "link": "https://github.com/username" }
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### Documentation Setup
|
||||
|
||||
```json
|
||||
{
|
||||
"collections": [
|
||||
{
|
||||
"type": "doc",
|
||||
"dir": "guide",
|
||||
"title": "指南",
|
||||
"sidebar": "auto"
|
||||
}
|
||||
],
|
||||
"navbar": [
|
||||
{ "text": "指南", "link": "/guide/", "icon": "mdi:book-open-outline" }
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### Multi-language Setup
|
||||
|
||||
```json
|
||||
{
|
||||
"locales": {
|
||||
"/": {
|
||||
"selectLanguageName": "简体中文",
|
||||
"selectLanguageText": "选择语言"
|
||||
},
|
||||
"/en/": {
|
||||
"selectLanguageName": "English",
|
||||
"selectLanguageText": "Languages"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Search Configuration
|
||||
|
||||
```text
|
||||
// Local search (default)
|
||||
{
|
||||
search: {
|
||||
provider: 'local'
|
||||
}
|
||||
}
|
||||
|
||||
// Algolia DocSearch
|
||||
{
|
||||
search: {
|
||||
provider: 'algolia',
|
||||
appId: 'YOUR_APP_ID',
|
||||
apiKey: 'YOUR_API_KEY',
|
||||
indexName: 'YOUR_INDEX_NAME'
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Comments Configuration
|
||||
|
||||
```text
|
||||
// Giscus
|
||||
{
|
||||
comment: {
|
||||
provider: 'Giscus',
|
||||
repo: 'owner/repo',
|
||||
repoId: '...',
|
||||
category: 'Announcements',
|
||||
categoryId: '...'
|
||||
}
|
||||
}
|
||||
|
||||
// Waline
|
||||
{
|
||||
comment: {
|
||||
provider: 'Waline',
|
||||
serverURL: 'https://your-waline-server.vercel.app'
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Encryption Configuration
|
||||
|
||||
```text
|
||||
// Global encryption
|
||||
{
|
||||
encrypt: {
|
||||
global: true,
|
||||
admin: ['password1', 'password2']
|
||||
}
|
||||
}
|
||||
|
||||
// Partial encryption
|
||||
{
|
||||
encrypt: {
|
||||
rules: {
|
||||
'secret/': 'password',
|
||||
'/article/secret/': ['pass1', 'pass2'],
|
||||
'^/private/': 'private-pass'
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Execution Feedback
|
||||
|
||||
- Written file path and format type
|
||||
@ -559,10 +636,11 @@ module.exports = defineUserConfig({
|
||||
- Theme: [theme.md](https://theme-plume.vuejs.press/config/theme/)
|
||||
- Locales: [locales.md](https://theme-plume.vuejs.press/config/locales/)
|
||||
- Collections: [collections.md](https://theme-plume.vuejs.press/config/collections/)
|
||||
- Navbar: [navbar.md](https://theme-plume.vuejs.press/config/navigation/)
|
||||
- Navbar: [navbar.md](https://theme-plume.vuejs.press/config/navbar/)
|
||||
- Sidebar: [sidebar.md](https://theme-plume.vuejs.press/config/sidebar/)
|
||||
- Markdown: [markdown.md](https://theme-plume.vuejs.press/config/markdown/)
|
||||
- Plugins: [plugins/README.md](https://theme-plume.vuejs.press/config/plugins/)
|
||||
- Encryption: [encryption.md](https://theme-plume.vuejs.press/guide/features/encryption/)
|
||||
- Bulletin: [bulletin.md](https://theme-plume.vuejs.press/guide/features/bulletin/)
|
||||
- Copyright: [copyright.md](https://theme-plume.vuejs.press/guide/features/copyright/)
|
||||
- LLMs txt: [llmstxt.md](https://theme-plume.vuejs.press/guide/features/llmstxt/)
|
||||
|
||||
@ -23,6 +23,71 @@ It helps users write rich content using the features provided by the theme.
|
||||
- [Code Features](https://theme-plume.vuejs.press/guide/code/features/)
|
||||
- [Code Intro](https://theme-plume.vuejs.press/guide/code/intro/)
|
||||
|
||||
## Enabling Features
|
||||
|
||||
Most markdown extensions need to be enabled in `.vuepress/config.ts`:
|
||||
|
||||
```ts
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
markdown: {
|
||||
// Containers
|
||||
hint: true, // Info, tip, warning, caution containers (default: true)
|
||||
alert: true, // GitHub-style alerts (default: true)
|
||||
|
||||
// Code
|
||||
codeTabs: true, // Code block tabs (default: true)
|
||||
tabs: true, // General tabs (default: true)
|
||||
|
||||
// Content
|
||||
annotation: false, // Inline annotations
|
||||
abbr: false, // Abbreviations
|
||||
mark: 'eager', // Mark/highlight text (default: 'eager')
|
||||
|
||||
// Layout
|
||||
fileTree: true, // File tree container (default: true)
|
||||
flex: false, // Flex layout
|
||||
collapse: false, // Collapsible sections
|
||||
chat: false, // Chat dialog
|
||||
timeline: false, // Timeline
|
||||
field: false, // Field container
|
||||
table: false, // Enhanced table container
|
||||
demo: false, // Demo container
|
||||
|
||||
// Embeds
|
||||
pdf: false, // PDF embed
|
||||
bilibili: false, // Bilibili video
|
||||
youtube: false, // YouTube video
|
||||
artPlayer: false, // ArtPlayer video
|
||||
audioReader: false, // Audio
|
||||
|
||||
// Code demos
|
||||
codepen: false, // CodePen
|
||||
codeSandbox: false, // CodeSandbox
|
||||
jsfiddle: false, // JSFiddle
|
||||
repl: false, // REPL
|
||||
|
||||
// Charts
|
||||
chartjs: false, // Chart.js
|
||||
echarts: false, // ECharts
|
||||
mermaid: false, // Mermaid
|
||||
markmap: false, // Markmap
|
||||
plantuml: false, // PlantUML
|
||||
flowchart: false, // Flowchart
|
||||
|
||||
// Other
|
||||
npmTo: false, // npm/yarn/pnpm switcher
|
||||
caniuse: false, // Can I Use embed
|
||||
icon: { provider: 'iconify' }, // Icons (default: iconify)
|
||||
plot: true, // Hidden text (spoiler) (default: true)
|
||||
imageSize: false, // Auto image dimensions
|
||||
include: true, // Include markdown files (default: true)
|
||||
math: { type: 'katex' }, // Math formulas (default: katex)
|
||||
},
|
||||
}),
|
||||
})
|
||||
```
|
||||
|
||||
## Markdown Extensions
|
||||
|
||||
### Containers
|
||||
@ -77,6 +142,7 @@ It helps users write rich content using the features provided by the theme.
|
||||
|
||||
See [resources/code-features.md](resources/code-features.md) for detailed code block features:
|
||||
|
||||
- **Code Title** - `title="filename.ext"` after language
|
||||
- **Line Numbers** - `:line-numbers`, `:no-line-numbers`, `:line-numbers=2`
|
||||
- **Line Highlighting** - `{1,3,5-7}` or `// [!code highlight]`
|
||||
- **Line Focus** - `// [!code focus]` or `// [!code focus:3]`
|
||||
@ -85,69 +151,6 @@ See [resources/code-features.md](resources/code-features.md) for detailed code b
|
||||
- **Word Highlight** - `// [!code word:keyword]` or `// [!code word:keyword:2]`
|
||||
- **Whitespace** - `:whitespace` to show tabs/spaces
|
||||
- **Collapsed Lines** - `:collapsed-lines` or `:collapsed-lines=10`
|
||||
- **Code Title** - `title="filename.ext"` after language
|
||||
|
||||
## Enabling Features
|
||||
|
||||
Most markdown extensions need to be enabled in `.vuepress/config.ts`:
|
||||
|
||||
```ts
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
markdown: {
|
||||
// Containers
|
||||
hint: true, // Info, tip, warning, caution containers
|
||||
alert: true, // GitHub-style alerts
|
||||
|
||||
// Code
|
||||
codeTabs: true, // Code block tabs
|
||||
tabs: true, // General tabs
|
||||
|
||||
// Content
|
||||
annotation: true, // Inline annotations
|
||||
abbr: true, // Abbreviations
|
||||
mark: 'eager', // Mark/highlight text
|
||||
|
||||
// Layout
|
||||
fileTree: true, // File tree container
|
||||
flex: true, // Flex layout
|
||||
collapse: true, // Collapsible sections
|
||||
chat: true, // Chat dialog
|
||||
timeline: true, // Timeline
|
||||
|
||||
// Embeds
|
||||
pdf: true, // PDF embed
|
||||
bilibili: true, // Bilibili video
|
||||
youtube: true, // YouTube video
|
||||
artPlayer: true, // ArtPlayer video
|
||||
audioReader: true, // Audio
|
||||
|
||||
// Code demos
|
||||
codepen: true, // CodePen
|
||||
codeSandbox: true, // CodeSandbox
|
||||
jsfiddle: true, // JSFiddle
|
||||
repl: true, // REPL
|
||||
|
||||
// Charts
|
||||
chartjs: true, // Chart.js
|
||||
echarts: true, // ECharts
|
||||
mermaid: true, // Mermaid
|
||||
markmap: true, // Markmap
|
||||
plantuml: true, // PlantUML
|
||||
flowchart: true, // Flowchart
|
||||
|
||||
// Other
|
||||
npmTo: true, // npm/yarn/pnpm switcher
|
||||
caniuse: true, // Can I Use embed
|
||||
icon: { // Icons
|
||||
provider: 'iconify' // or 'iconfont', 'fontawesome'
|
||||
},
|
||||
plot: true, // Hidden text (spoiler)
|
||||
imageSize: true, // Auto image dimensions
|
||||
}
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
## Standard Markdown Extensions
|
||||
|
||||
@ -175,7 +178,7 @@ code content
|
||||
### With Features
|
||||
|
||||
````md
|
||||
```ts:title="example.ts":line-numbers {2,4-6}
|
||||
```ts title="example.ts":line-numbers {2,4-6}
|
||||
// [!code highlight]
|
||||
const example = 'highlighted'
|
||||
// [!code ++]
|
||||
@ -193,6 +196,39 @@ console.log(example)
|
||||
```
|
||||
````
|
||||
|
||||
### Language-Specific Comments
|
||||
|
||||
Different languages use different comment syntax:
|
||||
|
||||
| Language | Highlight | Focus | Diff Add | Diff Remove |
|
||||
|----------|-----------|-------|----------|-------------|
|
||||
| JS/TS/JSX/TSX | `// [!code highlight]` | `// [!code focus]` | `// [!code ++]` | `// [!code --]` |
|
||||
| Python/Ruby/YAML | `# [!code highlight]` | `# [!code focus]` | `# [!code ++]` | `# [!code --]` |
|
||||
| CSS/SCSS | `/* [!code highlight] */` | `/* [!code focus] */` | `/* [!code ++] */` | `/* [!code --] */` |
|
||||
| HTML/XML | `<!-- [!code highlight] -->` | `<!-- [!code focus] -->` | `<!-- [!code ++] -->` | `<!-- [!code --] -->` |
|
||||
| Bash/Shell | `# [!code highlight]` | `# [!code focus]` | `# [!code ++]` | `# [!code --]` |
|
||||
| SQL | `-- [!code highlight]` | `-- [!code focus]` | `-- [!code ++]` | `-- [!code --]` |
|
||||
|
||||
### Global Configuration
|
||||
|
||||
Enable features globally in `.vuepress/config.ts`:
|
||||
|
||||
```ts
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
codeHighlighter: {
|
||||
lineNumbers: true, // Enable line numbers globally
|
||||
whitespace: false, // Show whitespace globally
|
||||
collapsedLines: false, // Collapse lines globally
|
||||
theme: { light: 'github-light', dark: 'github-dark' },
|
||||
twoslash: false, // TypeScript twoslash
|
||||
},
|
||||
}),
|
||||
})
|
||||
```
|
||||
|
||||
When enabled globally, use `:no-line-numbers`, `:no-whitespace`, `:no-collapsed-lines` to disable per block.
|
||||
|
||||
## Frontmatter
|
||||
|
||||
Common frontmatter for markdown files:
|
||||
@ -226,12 +262,14 @@ coverStyle:
|
||||
```
|
||||
|
||||
### Home Page Frontmatter
|
||||
|
||||
```md
|
||||
---
|
||||
pageLayout: home
|
||||
config:
|
||||
- type: hero
|
||||
full: true
|
||||
effect: hyper-speed
|
||||
forceDark: true
|
||||
hero:
|
||||
name: Site Name
|
||||
tagline: Tagline
|
||||
@ -245,10 +283,70 @@ config:
|
||||
- title: Feature 1
|
||||
icon: icon-name
|
||||
details: Description
|
||||
- type: image-text
|
||||
title: Section Title
|
||||
image: /images/feature.svg
|
||||
list:
|
||||
- title: Item 1
|
||||
description: Description
|
||||
- type: text-image
|
||||
title: Section Title
|
||||
image: /images/feature.svg
|
||||
list:
|
||||
- title: Item 1
|
||||
description: Description
|
||||
- type: custom
|
||||
---
|
||||
```
|
||||
|
||||
## LLMs txt Markup
|
||||
|
||||
When `llmstxt` is enabled, you can use special markup:
|
||||
|
||||
### `<llm-only>` - Content visible only to LLMs
|
||||
```md
|
||||
<llm-only>
|
||||
|
||||
## Section for LLMs
|
||||
|
||||
This content only appears in LLM-generated files.
|
||||
|
||||
</llm-only>
|
||||
```
|
||||
|
||||
### `<llm-exclude>` - Content hidden from LLMs
|
||||
```md
|
||||
<llm-exclude>
|
||||
|
||||
## Section for humans
|
||||
|
||||
This content will not appear in LLM files.
|
||||
|
||||
</llm-exclude>
|
||||
```
|
||||
|
||||
## Components
|
||||
|
||||
### Swiper (Carousel)
|
||||
|
||||
Requires installing `swiper`:
|
||||
|
||||
```bash
|
||||
npm install swiper
|
||||
```
|
||||
|
||||
```md
|
||||
<script setup>
|
||||
import Swiper from 'vuepress-theme-plume/features/Swiper.vue'
|
||||
</script>
|
||||
|
||||
<Swiper :items="['img1.jpg', 'img2.jpg']" />
|
||||
```
|
||||
|
||||
Props: `items`, `width`, `height`, `mode` ('banner'|'carousel'|'broadcast'), `navigation`, `effect`, `delay`, `speed`, `loop`, `pauseOnMouseEnter`, `swipe`
|
||||
|
||||
## References
|
||||
|
||||
- [VuePress Markdown](https://v2.vuepress.vuejs.org/guide/markdown.html)
|
||||
- [Plume Theme Docs](https://theme-plume.vuejs.press/)
|
||||
- [Markdown Configuration](https://theme-plume.vuejs.press/config/markdown/)
|
||||
|
||||
@ -2,10 +2,24 @@
|
||||
|
||||
Display chat records using `::: chat` container.
|
||||
|
||||
## Enable
|
||||
|
||||
This feature is disabled by default, enable it in theme config:
|
||||
|
||||
```ts title=".vuepress/config.ts"
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
markdown: {
|
||||
chat: true, // [!code ++]
|
||||
}
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
## Syntax
|
||||
|
||||
- Container: `::: chat title="Title"`
|
||||
- Timestamp: `{:timestamp}`
|
||||
- Timestamp: `{:timestamp}` (optional)
|
||||
- Other User: `{username}`
|
||||
- Current User: `{.}`
|
||||
|
||||
@ -13,7 +27,7 @@ Display chat records using `::: chat` container.
|
||||
|
||||
```md
|
||||
::: chat title="Conversation"
|
||||
{:2023-10-01 12:00}
|
||||
{:2025-03-24 10:15:00}
|
||||
|
||||
{Alice}
|
||||
Hello there!
|
||||
@ -25,3 +39,9 @@ Hi Alice! How are you?
|
||||
I'm good, thanks.
|
||||
:::
|
||||
```
|
||||
|
||||
## Notes
|
||||
|
||||
::: warning
|
||||
This is a feature that is rarely used. Please consider whether you need to use it. For content involving privacy, please filter it yourself.
|
||||
:::
|
||||
|
||||
@ -2,27 +2,59 @@
|
||||
|
||||
VuePress Plume theme provides rich code block features via Shiki highlighter.
|
||||
|
||||
## Code Title
|
||||
|
||||
Add `title="filename.ext"` after the language:
|
||||
|
||||
```markdown
|
||||
```json title="package.json"
|
||||
{
|
||||
"name": "vuepress-theme-plume"
|
||||
}
|
||||
```
|
||||
```
|
||||
|
||||
## Line Numbers
|
||||
|
||||
````md
|
||||
Theme shows line numbers by default. Control via `codeHighlighter.lineNumbers`:
|
||||
|
||||
```typescript title=".vuepress/config.ts"
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
codeHighlighter: {
|
||||
lineNumbers: true, // [!code ++]
|
||||
},
|
||||
}),
|
||||
})
|
||||
```
|
||||
|
||||
Per-block control:
|
||||
- `:line-numbers` - Enable line numbers
|
||||
- `:no-line-numbers` - Disable line numbers
|
||||
- `:line-numbers=2` - Start from line 2
|
||||
|
||||
```markdown
|
||||
```ts:line-numbers
|
||||
// Enable line numbers (default)
|
||||
// Line numbers enabled
|
||||
const line2 = 'This is line 2'
|
||||
```
|
||||
|
||||
```ts:no-line-numbers
|
||||
// Disable line numbers
|
||||
// Line numbers disabled
|
||||
const line3 = 'This is line 3'
|
||||
```
|
||||
|
||||
```ts:line-numbers=2
|
||||
// Start from line 2
|
||||
// Line numbers start from 2
|
||||
const line3 = 'This is line 3'
|
||||
```
|
||||
```
|
||||
````
|
||||
|
||||
## Line Highlighting
|
||||
|
||||
### Bracket Syntax
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts{1,3,5-7}
|
||||
// Line 1 highlighted
|
||||
// Line 2 normal
|
||||
@ -30,99 +62,119 @@ VuePress Plume theme provides rich code block features via Shiki highlighter.
|
||||
// Line 4 normal
|
||||
// Line 5-7 highlighted
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
Formats:
|
||||
- Single line: `{4}`
|
||||
- Multiple lines: `{5-8}`, `{3-10}`
|
||||
- Multiple single lines: `{4,7,9}`
|
||||
- Combined: `{4,7-13,16,23-27,40}`
|
||||
|
||||
### Comment Syntax
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
const a = 1
|
||||
const b = 2 // [!code highlight]
|
||||
const c = 3
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
## Line Focus
|
||||
|
||||
Focus a line and dim others:
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
const a = 1
|
||||
const b = 2 // [!code focus]
|
||||
const c = 3
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
Focus multiple lines:
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
const a = 1 // [!code focus:3]
|
||||
const b = 2
|
||||
const c = 3
|
||||
const d = 4
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
## Diff Highlighting
|
||||
|
||||
Show code changes:
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
const oldVal = 'value' // [!code --]
|
||||
const newVal = 'value' // [!code ++]
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
## Warning and Error
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
const warning = 'caution' // [!code warning]
|
||||
const error = 'failed' // [!code error]
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
## Word Highlight
|
||||
|
||||
Highlight specific words:
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
// [!code word:config]
|
||||
const config = {}
|
||||
console.log(config)
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
Highlight with count limit:
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts
|
||||
// [!code word:api:2]
|
||||
const api = {}
|
||||
const apiClient = {}
|
||||
const apiKey = {} // Not highlighted
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
## Whitespace Visibility
|
||||
|
||||
Show tabs and spaces:
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts:whitespace
|
||||
const a = 1
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
Global enable:
|
||||
|
||||
```typescript title=".vuepress/config.ts"
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
codeHighlighter: {
|
||||
whitespace: true, // [!code ++]
|
||||
},
|
||||
}),
|
||||
})
|
||||
```
|
||||
|
||||
When enabled globally, use `:no-whitespace` to disable per block.
|
||||
|
||||
## Collapsed Lines
|
||||
|
||||
Collapse long code blocks:
|
||||
Collapse long code blocks (default from line 15):
|
||||
|
||||
````md
|
||||
```markdown
|
||||
```ts:collapsed-lines
|
||||
// Lines after 15th will be collapsed
|
||||
```
|
||||
@ -130,34 +182,34 @@ Collapse long code blocks:
|
||||
```ts:collapsed-lines=10
|
||||
// Lines after 10th will be collapsed
|
||||
```
|
||||
````
|
||||
|
||||
## Code Title
|
||||
|
||||
Add filename to code block:
|
||||
|
||||
````md
|
||||
```ts title="config.ts"
|
||||
const config = {}
|
||||
```
|
||||
|
||||
```ts title="/path/to/file.ts"
|
||||
const code = {}
|
||||
Global enable:
|
||||
|
||||
```typescript title=".vuepress/config.ts"
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
codeHighlighter: {
|
||||
collapsedLines: true, // [!code ++]
|
||||
},
|
||||
}),
|
||||
})
|
||||
```
|
||||
````
|
||||
|
||||
When enabled globally, use `:no-collapsed-lines` to disable per block.
|
||||
|
||||
## Combining Features
|
||||
|
||||
Multiple features can be combined:
|
||||
|
||||
````md
|
||||
```ts:title="example.ts":line-numbers {2,4} // [!code highlight]
|
||||
```markdown
|
||||
```ts:title="example.ts":line-numbers {2,4}
|
||||
const a = 1
|
||||
const b = 2 // [!code ++]
|
||||
const c = 3
|
||||
const d = 4 // [!code focus]
|
||||
```
|
||||
````
|
||||
```
|
||||
|
||||
## Language-Specific Comments
|
||||
|
||||
@ -176,18 +228,17 @@ Different languages use different comment syntax:
|
||||
|
||||
## Global Configuration
|
||||
|
||||
Enable features globally in `.vuepress/config.ts`:
|
||||
|
||||
```ts
|
||||
```typescript title=".vuepress/config.ts"
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
codeHighlighter: {
|
||||
lineNumbers: true, // Enable line numbers globally
|
||||
whitespace: true, // Show whitespace globally
|
||||
collapsedLines: true, // Collapse lines globally
|
||||
}
|
||||
})
|
||||
whitespace: false, // Show whitespace globally
|
||||
collapsedLines: false, // Collapse lines globally
|
||||
theme: { light: 'github-light', dark: 'github-dark' },
|
||||
languages: ['js', 'ts', 'vue', 'bash', 'json'],
|
||||
twoslash: false, // TypeScript twoslash
|
||||
},
|
||||
}),
|
||||
})
|
||||
```
|
||||
|
||||
When enabled globally, use `:no-line-numbers`, `:no-whitespace`, `:no-collapsed-lines` to disable per block.
|
||||
|
||||
@ -10,8 +10,8 @@ Enable in `.vuepress/config.ts`:
|
||||
export default defineUserConfig({
|
||||
theme: plumeTheme({
|
||||
markdown: {
|
||||
hint: true, // Enable info, tip, warning, caution, note containers
|
||||
alert: true, // Enable GitHub-style alerts
|
||||
hint: true, // Enable info, tip, warning, caution, note containers (default: true)
|
||||
alert: true, // Enable GitHub-style alerts (default: true)
|
||||
}
|
||||
})
|
||||
})
|
||||
@ -45,6 +45,14 @@ Content here
|
||||
### Basic Alerts
|
||||
|
||||
```md
|
||||
::: note
|
||||
This is a note with default title.
|
||||
:::
|
||||
|
||||
::: info
|
||||
This is an info box.
|
||||
:::
|
||||
|
||||
::: tip
|
||||
This is a tip with default title.
|
||||
:::
|
||||
@ -57,7 +65,7 @@ This tip has a custom title.
|
||||
Be careful with this step.
|
||||
:::
|
||||
|
||||
::: danger STOP!
|
||||
::: caution STOP!
|
||||
This action is irreversible.
|
||||
:::
|
||||
```
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user