docs: improve chinese translation (#3402)

pull/3403/head
烽宁 6 months ago committed by GitHub
parent 862b4be867
commit 1407baf9b9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -24,16 +24,16 @@ outline: deep
```js
export default {
async paths() {
// use respective CMS client library if needed
// 如有需要,使用相应的 CMS 客户端库
const data = await (await fetch('https://my-cms-api', {
headers: {
// token if necessary
// 如有必要,可使用 token
}
})).json()
return data.map(entry => {
return {
params: { id: entry.id, /* title, authors, date etc. */ },
params: { id: entry.id, /* title, authors, date */ },
content: entry.content
}
})

@ -6,11 +6,11 @@
```
.
├─ docs # project root
├─ docs # 项目根目录
│ ├─ .vitepress
│ │ ├─ theme
│ │ │ └─ index.js # theme entry
│ │ └─ config.js # config file
│ │ │ └─ index.js # 主题入口
│ │ └─ config.js # 配置文件
│ └─ index.md
└─ package.json
```
@ -24,26 +24,26 @@ VitePress 自定义主题是一个对象,该对象具有如下接口:
```ts
interface Theme {
/**
* Root layout component for every page
* 每个页面的根布局组件
* @required
*/
Layout: Component
/**
* Enhance Vue app instance
* 增强 Vue 应用实例
* @optional
*/
enhanceApp?: (ctx: EnhanceAppContext) => Awaitable<void>
/**
* Extend another theme, calling its `enhanceApp` before ours
* 扩展另一个主题,在我们的主题之前调用它的 `enhanceApp`
* @optional
*/
extends?: Theme
}
interface EnhanceAppContext {
app: App // Vue app instance
router: Router // VitePress router instance
siteData: Ref<SiteData> // Site-level metadata
app: App // Vue 应用实例
router: Router // VitePress 路由实例
siteData: Ref<SiteData> // 站点级元数据
}
```
@ -52,8 +52,8 @@ interface EnhanceAppContext {
```js
// .vitepress/theme/index.js
// You can directly import Vue files in the theme entry
// VitePress is pre-configured with @vitejs/plugin-vue.
// 可以直接在主题入口导入 Vue 文件
// VitePress 已预先配置 @vitejs/plugin-vue
import Layout from './Layout.vue'
export default {
@ -77,7 +77,7 @@ export default {
<template>
<h1>Custom Layout!</h1>
<!-- this is where markdown content will be rendered -->
<!-- 此处将渲染 markdown 内容 -->
<Content />
</template>
```
@ -200,7 +200,7 @@ export default {
import baseConfig from 'awesome-vitepress-theme/config'
export default {
// extend theme base config (if needed)
// 扩展主题的基本配置(如需要)
extends: baseConfig
}
```
@ -216,7 +216,7 @@ import type { ThemeConfig } from 'awesome-vitepress-theme'
export default defineConfigWithTheme<ThemeConfig>({
extends: baseConfig,
themeConfig: {
// Type is `ThemeConfig`
// 类型为 `ThemeConfig`
}
})
```

@ -46,7 +46,7 @@ import { data } from './example.data.js'
```js
export default {
async load() {
// fetch remote data
// 获取远程数据
return (await fetch('...')).json()
}
}
@ -67,9 +67,8 @@ import { parse } from 'csv-parse/sync'
export default {
watch: ['./data/*.csv'],
load(watchedFiles) {
// watchedFiles will be an array of absolute paths of the matched files.
// generate an array of blog post metadata that can be used to render
// a list in the theme layout
// watchFiles 是一个所匹配文件的绝对路径的数组。
// 生成一个博客文章元数据数组,可用于在主题布局中呈现列表。
return watchedFiles.map((file) => {
return parse(fs.readFileSync(file, 'utf-8'), {
columns: true,
@ -99,14 +98,14 @@ export default createContentLoader('posts/*.md', /* options */)
```ts
interface ContentData {
// mapped URL for the page. e.g. /posts/hello.html (does not include base)
// manually iterate or use custom `transform` to normalize the paths
// 页面的映射 URL如 /posts/hello.html不包括 base
// 手动迭代或使用自定义 `transform` 来标准化路径
url: string
// frontmatter data of the page
// 页面的 frontmatter 数据
frontmatter: Record<string, any>
// the following are only present if relevant options are enabled
// we will discuss them below
// 只有启用了相关选项,才会出现以下内容
// 我们将在下面讨论它们
src: string | undefined
html: string | undefined
excerpt: string | undefined
@ -140,18 +139,18 @@ import { data as posts } from './posts.data.js'
import { createContentLoader } from 'vitepress'
export default createContentLoader('posts/*.md', {
includeSrc: true, // include raw markdown source?
render: true, // include rendered full page HTML?
excerpt: true, // include excerpt?
includeSrc: true, // 包含原始 markdown 源?
render: true, // 包含渲染的整页 HTML?
excerpt: true, // 包含摘录?
transform(rawData) {
// map, sort, or filter the raw data as you wish.
// the final result is what will be shipped to the client.
// 根据需要对原始数据进行 map、sort 或 filter
// 最终的结果是将发送给客户端的内容
return rawData.sort((a, b) => {
return +new Date(b.frontmatter.date) - +new Date(a.frontmatter.date)
}).map((page) => {
page.src // raw markdown source
page.html // rendered full page HTML
page.excerpt // rendered excerpt HTML (content above first `---`)
page.src // 原始 markdown 源
page.html // 渲染的整页 HTML
page.excerpt // 渲染的摘录 HTML第一个 `---` 上面的内容)
return {/* ... */}
})
}
@ -167,7 +166,7 @@ export default createContentLoader('posts/*.md', {
export default {
async buildEnd() {
const posts = await createContentLoader('posts/*.md').load()
// generate files based on posts metadata, e.g. RSS feed
// 根据 posts 元数据生成文件,如 RSS 订阅源
}
}
```
@ -177,24 +176,24 @@ export default {
```ts
interface ContentOptions<T = ContentData[]> {
/**
* Include src?
* 包含 src?
* @default false
*/
includeSrc?: boolean
/**
* Render src to HTML and include in data?
* 将 src 渲染为 HTML 并包含在数据中?
* @default false
*/
render?: boolean
/**
* If `boolean`, whether to parse and include excerpt? (rendered as HTML)
* 如果为 `boolean`,是否解析并包含摘录? (呈现为 HTML)
*
* If `function`, control how the excerpt is extracted from the content.
* 如果为 `function`,则控制如何从内容中提取摘录
*
* If `string`, define a custom separator to be used for extracting the
* excerpt. Default separator is `---` if `excerpt` is `true`.
* 如果为 `string`,则定义用于提取摘录的自定义分隔符
* 如果 `excerpt``true`,则默认分隔符为 `---`
*
* @see https://github.com/jonschlinkert/gray-matter#optionsexcerpt
* @see https://github.com/jonschlinkert/gray-matter#optionsexcerpt_separator
@ -207,8 +206,7 @@ interface ContentOptions<T = ContentData[]> {
| string
/**
* Transform the data. Note the data will be inlined as JSON in the client
* bundle if imported from components or markdown files.
* 转换数据。请注意,如果从组件或 Markdown 文件导入,数据将以 JSON 形式内联到客户端包中
*/
transform?: (data: ContentData[]) => T | Promise<T>
}
@ -222,14 +220,14 @@ interface ContentOptions<T = ContentData[]> {
import { defineLoader } from 'vitepress'
export interface Data {
// data type
// data 类型
}
declare const data: Data
export { data }
export default defineLoader({
// type checked loader options
// 类型检查加载器选项
watch: ['...'],
async load(): Promise<Data> {
// ...

@ -122,61 +122,61 @@ Cache-Control: max-age=31536000,immutable
1. 在项目的 `.github/workflows` 目录中创建一个名为 `deploy.yml` 的文件,其中包含这样的内容:
```yaml
# Sample workflow for building and deploying a VitePress site to GitHub Pages
# 构建 VitePress 站点并将其部署到 GitHub Pages 的示例工作流程
#
name: Deploy VitePress site to Pages
on:
# Runs on pushes targeting the `main` branch. Change this to `master` if you're
# using the `master` branch as the default branch.
# 在针对 `main` 分支的推送上运行。如果您
# 使用 `master` 分支作为默认分支,请将其更改为 `master`
push:
branches: [main]
# Allows you to run this workflow manually from the Actions tab
# 允许您从 Actions 选项卡手动运行此工作流程
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
# 设置 GITHUB_TOKEN 的权限,以允许部署到 GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
# 只允许同时进行一次部署,跳过正在运行和最新队列之间的运行队列
# 但是,不要取消正在进行的运行,因为我们希望允许这些生产部署完成
concurrency:
group: pages
cancel-in-progress: false
jobs:
# Build job
# 构建工作
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v3
with:
fetch-depth: 0 # Not needed if lastUpdated is not enabled
# - uses: pnpm/action-setup@v2 # Uncomment this if you're using pnpm
# - uses: oven-sh/setup-bun@v1 # Uncomment this if you're using Bun
fetch-depth: 0 # 如果未启用 lastUpdated则不需要
# - uses: pnpm/action-setup@v2 # 如果使用 pnpm请取消注释
# - uses: oven-sh/setup-bun@v1 # 如果使用 Bun请取消注释
- name: Setup Node
uses: actions/setup-node@v3
with:
node-version: 18
cache: npm # or pnpm / yarn
cache: npm # pnpm / yarn
- name: Setup Pages
uses: actions/configure-pages@v3
- name: Install dependencies
run: npm ci # or pnpm install / yarn install / bun install
run: npm ci # pnpm install / yarn install / bun install
- name: Build with VitePress
run: |
npm run docs:build # or pnpm docs:build / yarn docs:build / bun run docs:build
npm run docs:build # pnpm docs:build / yarn docs:build / bun run docs:build
touch docs/.vitepress/dist/.nojekyll
- name: Upload artifact
uses: actions/upload-pages-artifact@v2
with:
path: docs/.vitepress/dist
# Deployment job
# 部署工作
deploy:
environment:
name: github-pages
@ -211,7 +211,7 @@ Cache-Control: max-age=31536000,immutable
paths:
- node_modules/
script:
# - apk add git # Uncomment this if you're using small docker images like alpine and have lastUpdated enabled
# - apk add git # 如果你使用的是像 alpine 这样的小型 docker 镜像,并且启用了 lastUpdated请取消注释
- npm install
- npm run docs:build
artifacts:

@ -72,7 +72,7 @@ export default DefaultTheme
// .vitepress/config.js
export default {
transformHead({ assets }) {
// adjust the regex accordingly to match your font
// 相应地调整正则表达式以匹配字体
const myFontFile = assets.find(file => /font-name\.\w+\.woff2/)
if (myFontFile) {
return [
@ -102,7 +102,7 @@ import DefaultTheme from 'vitepress/theme'
export default {
extends: DefaultTheme,
enhanceApp({ app }) {
// register your custom global components
// 注册自定义全局组件
app.component('MyGlobalComponent' /* ... */)
}
}
@ -117,7 +117,7 @@ import DefaultTheme from 'vitepress/theme'
export default {
extends: DefaultTheme,
enhanceApp({ app }) {
// register your custom global components
// 注册自定义全局组件
app.component('MyGlobalComponent' /* ... */)
}
} satisfies Theme
@ -136,8 +136,7 @@ import MyLayout from './MyLayout.vue'
export default {
extends: DefaultTheme,
// override the Layout with a wrapper component that
// injects the slots
// 使用注入插槽的包装组件覆盖 Layout
Layout: MyLayout
}
```

@ -115,12 +115,12 @@ $ bunx vitepress init
```js
// .vitepress/config.js
export default {
// site-level options
// 站点级选项
title: 'VitePress',
description: 'Just playing around.',
themeConfig: {
// theme-level options
// 主题级选项
}
}
```

@ -17,7 +17,7 @@ docs/
import { defineConfig } from 'vitepress'
export default defineConfig({
// shared properties and other top-level stuff...
// 共享属性和其他顶层内容...
locales: {
root: {
@ -26,10 +26,10 @@ export default defineConfig({
},
fr: {
label: 'French',
lang: 'fr', // optional, will be added as `lang` attribute on `html` tag
link: '/fr/guide' // default /fr/ -- shows on navbar translations menu, can be external
lang: 'fr', // 可选,将作为 `lang` 属性添加到 `html` 标签中
link: '/fr/guide' // 默认 /fr/ -- 显示在导航栏翻译菜单上,可以是外部的
// other locale specific properties...
// 其余 locale 特定属性...
}
}
})
@ -44,8 +44,8 @@ interface LocaleSpecificConfig<ThemeConfig = any> {
title?: string
titleTemplate?: string | boolean
description?: string
head?: HeadConfig[] // will be merged with existing head entries, duplicate meta tags are automatically removed
themeConfig?: ThemeConfig // will be shallow merged, common stuff can be put in top-level themeConfig entry
head?: HeadConfig[] // 将与现有的头部条目合并,重复的元标签将自动删除
themeConfig?: ThemeConfig // 会进行浅层合并,常见内容可放在顶层的 themeConfig 属性中
}
```

@ -42,12 +42,12 @@ VitePress 带有内置的 Markdown 拓展。
假设现在处于 `foo/one.md` 文件中:
```md
[Home](/) <!-- sends the user to the root index.md -->
[foo](/foo/) <!-- sends the user to index.html of directory foo -->
[foo heading](./#heading) <!-- anchors user to a heading in the foo index file -->
[bar - three](../bar/three) <!-- you can omit extension -->
[bar - three](../bar/three.md) <!-- you can append .md -->
[bar - four](../bar/four.html) <!-- or you can append .html -->
[Home](/) <!-- 将用户导航至根目录下的 index.html -->
[foo](/foo/) <!-- 将用户导航至目录 foo 下的 index.html -->
[foo heading](./#heading) <!-- 将用户锚定到 foo 索引文件中的一个标题上 -->
[bar - three](../bar/three) <!-- 可以省略扩展名 -->
[bar - three](../bar/three.md) <!-- 可以添加 .md -->
[bar - four](../bar/four.html) <!-- 或者可以添加 .html -->
```
### 页面后缀 {#page-suffix}
@ -259,7 +259,7 @@ Wraps in a <div class="vp-raw">
```js
postcssIsolateStyles({
includeFiles: [/vp-doc\.css/] // defaults to /base\.css/
includeFiles: [/vp-doc\.css/] // 默认为 /base\.css/
})
```
@ -523,23 +523,25 @@ export default {
可以在代码块中添加 `:line-numbers` / `:no-line-numbers` 标记来覆盖在配置中的设置。
还可以通过在 `:line-numbers` 之后添加 `=` 来自定义起始行号,例如 `:line-numbers=2` 表示代码块中的行号从 2 开始。
**输入**
````md
```ts {1}
// line-numbers is disabled by default
// 默认禁用行号
const line2 = 'This is line 2'
const line3 = 'This is line 3'
```
```ts:line-numbers {1}
// line-numbers is enabled
// 启用行号
const line2 = 'This is line 2'
const line3 = 'This is line 3'
```
```ts:line-numbers=2 {1}
// line-numbers is enabled and start from 2
// 行号已启用,并从 2 开始
const line3 = 'This is line 3'
const line4 = 'This is line 4'
```
@ -548,19 +550,19 @@ const line4 = 'This is line 4'
**输出**
```ts {1}
// line-numbers is disabled by default
// 默认禁用行号
const line2 = 'This is line 2'
const line3 = 'This is line 3'
```
```ts:line-numbers {1}
// line-numbers is enabled
// 启用行号
const line2 = 'This is line 2'
const line3 = 'This is line 3'
```
```ts:line-numbers=2 {1}
// line-numbers is enabled and start from 2
// 行号已启用,并从 2 开始
const line3 = 'This is line 3'
const line4 = 'This is line 4'
```
@ -701,11 +703,11 @@ export default config
```md
::: code-group
<!-- filename is used as title by default -->
<!-- 文件名默认用作标题 -->
<<< @/snippets/snippet.js
<!-- you can provide a custom one too -->
<!-- 也可以提供定制的代码组 -->
<<< @/snippets/snippet-with-region.js#snippet{1,2 ts:line-numbers} [snippet with region]
@ -853,12 +855,13 @@ $$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
## 图片懒加载 {#image-lazy-loading}
You can enable lazy loading for each image added via markdown by setting `lazyLoading` to `true` in your config file:
通过在配置文件中将 `lazyLoading` 设置为 `true`,可以为通过 markdown 添加的每张图片启用懒加载。
```js
export default {
markdown: {
image: {
// image lazy loading is disabled by default
// 默认禁用图片懒加载
lazyLoading: true
}
}
@ -876,16 +879,16 @@ import markdownItFoo from 'markdown-it-foo'
export default defineConfig({
markdown: {
// options for markdown-it-anchor
// markdown-it-anchor 的选项
// https://github.com/valeriangalliat/markdown-it-anchor#usage
anchor: {
permalink: markdownItAnchor.permalink.headerLink()
},
// options for @mdit-vue/plugin-toc
// @mdit-vue/plugin-toc 的选项
// https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-toc#options
toc: { level: [1, 2] },
config: (md) => {
// use more markdown-it plugins!
// 使用更多的 Markdown-it 插件!
md.use(markdownItFoo)
}
}

@ -40,8 +40,8 @@ VitePress 项目的文件结构中有两个重要的概念:项目根目录 (**
```
.
├─ docs # project root
│ ├─ .vitepress # config dir
├─ docs # 项目根目录
│ ├─ .vitepress # 配置目录
│ ├─ getting-started.md
│ └─ index.md
└─ ...
@ -65,9 +65,9 @@ docs/getting-started.md --> /getting-started.html
`srcDir` 选项是相对于项目根目录解析的。例如,对于 `srcDir: 'src'`,文件结构将如下所示:
```
. # project root
├─ .vitepress # config dir
└─ src # source dir
. # 项目根目录
├─ .vitepress # 配置目录
└─ src # 源目录
├─ getting-started.md
└─ index.md
```
@ -218,8 +218,8 @@ export default {
```
.
└─ packages
├─ [pkg].md # route template
└─ [pkg].paths.js # route paths loader
├─ [pkg].md # 路由模板
└─ [pkg].paths.js # 路由路径加载器
```
路径加载器应该提供一个带有 `paths` 方法的对象作为其默认导出。`paths` 方法应返回具有 `params` 属性的对象数组。这些对象中的每一个都将生成一个相应的页面。
@ -338,7 +338,7 @@ export default {
<script setup>
import { useData } from 'vitepress'
// params is a Vue ref
// params 是一个 Vue ref
const { params } = useData()
console.log(params.value)
@ -359,7 +359,7 @@ export default {
return posts.map((post) => {
return {
params: { id: post.id },
content: post.content // raw Markdown or HTML
content: post.content // 原始 Markdown 或 HTML
}
})
}

@ -40,7 +40,7 @@ export default defineConfig({
sitemap: {
hostname: 'https://example.com',
transformItems: (items) => {
// add new items or modify/filter existing items
// 添加新选项或修改/过滤现有选项
items.push({
url: '/extra-page',
changefreq: 'monthly',

@ -109,7 +109,7 @@ const clientCompRef = ref(null)
const ClientComp = defineClientComponent(
() => import('component-that-access-window-on-import'),
// args are passed to h() - https://vuejs.org/api/render-function.html#h
// 参数传递给 h() - https://vuejs.org/api/render-function.html#h
[
{
ref: clientCompRef
@ -121,7 +121,7 @@ const ClientComp = defineClientComponent(
}
],
// callback after the component is loaded, can be async
// 组件加载后的回调,可以是异步的
() => {
console.log(clientCompRef.value)
}

@ -7,10 +7,10 @@
### 用法
```sh
# start in current directory, omitting `dev`
# 从当前目录启动,省略 `dev`
vitepress
# start in sub directory
# 从子目录启动
vitepress dev [root]
```

@ -60,10 +60,10 @@
```ts
interface Props {
// When `<slot>` is passed, this value gets ignored.
// 当传递 `<slot>` 时,该值将被忽略
text?: string
// Defaults to `tip`.
// 默认为 `tip`.
type?: 'info' | 'tip' | 'warning' | 'danger'
}
```

@ -8,7 +8,7 @@ export default {
title: 'VitePress',
description: 'Vite & Vue powered static site generator.',
// Theme related configurations.
// 主题相关配置
themeConfig: {
logo: '/logo.svg',
nav: [...],
@ -139,26 +139,26 @@ export interface SidebarMulti {
export type SidebarItem = {
/**
* The text label of the item.
* 侧边栏项的文本标签
*/
text?: string
/**
* The link of the item.
* 侧边栏项的链接
*/
link?: string
/**
* The children of the item.
* 侧边栏项的子项
*/
items?: SidebarItem[]
/**
* If not specified, group is not collapsible.
* 如果未指定,侧边栏组不可折叠
*
* If `true`, group is collapsible and collapsed by default
* 如果为 `true`,则侧边栏组可折叠并且默认折叠
*
* If `false`, group is collapsible but expanded by default
* 如果为 `false`,则侧边栏组可折叠但默认展开
*/
collapsed?: boolean
}
@ -186,17 +186,17 @@ export type SidebarItem = {
```ts
interface Outline {
/**
* The levels of headings to be displayed in the outline.
* Single number means only headings of that level will be displayed.
* If a tuple is passed, the first number is the minimum level and the second number is the maximum level.
* `'deep'` is same as `[2, 6]`, which means all headings from `<h2>` to `<h6>` will be displayed.
* outline 中要显示的标题级别。
* 单个数字表示只显示该级别的标题。
* 如果传递的是一个元组,第一个数字是最小级别,第二个数字是最大级别。
* `'deep'` `[2, 6]` 相同,将显示从 `<h2>``<h6>` 的所有标题。
*
* @default 2
*/
level?: number | [number, number] | 'deep'
/**
* The title to be displayed on the outline.
* 显示在 outline 上的标题。
*
* @default 'On this page'
*/
@ -216,13 +216,13 @@ export default {
socialLinks: [
{ icon: 'github', link: 'https://github.com/vuejs/vitepress' },
{ icon: 'twitter', link: '...' },
// You can also add custom icons by passing SVG as string:
// 可以通过将 SVG 作为字符串传递来添加自定义图标:
{
icon: {
svg: '<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Dribbble</title><path d="M12...6.38z"/></svg>'
},
link: '...',
// You can include a custom label for accessibility too (optional but recommended):
// 也可以为可访问性添加一个自定义标签(可选但推荐):
ariaLabel: 'cool link'
}
]
@ -373,7 +373,7 @@ export interface CarbonAdsOptions {
}
```
Learn more in [Default Theme: Carbon Ads](./default-theme-carbon-ads)
[Default Theme: Carbon Ads](./default-theme-carbon-ads) 中了解更多信息。
## docFooter
@ -404,46 +404,46 @@ export interface DocFooter {
- 类型:`string`
- 默认值:`Appearance`
Can be used to customize the dark mode switch label. This label is only displayed in the mobile view.
用于自定义暗模式开关标签,该标签仅在移动端视图中显示。
## lightModeSwitchTitle
- 类型:`string`
- 默认值:`Switch to light theme`
Can be used to customize the light mode switch title that appears on hovering.
用于自定义悬停时显示的亮模式开关标题。
## darkModeSwitchTitle
- 类型:`string`
- 默认值:`Switch to dark theme`
Can be used to customize the dark mode switch title that appears on hovering.
用于自定义悬停时显示的暗模式开关标题。
## sidebarMenuLabel
- 类型:`string`
- 默认值:`Menu`
Can be used to customize the sidebar menu label. This label is only displayed in the mobile view.
用于自定义侧边栏菜单标签,该标签仅在移动端视图中显示。
## returnToTopLabel
- 类型:`string`
- 默认值:`Return to top`
Can be used to customize the label of the return to top button. This label is only displayed in the mobile view.
用于自定义返回顶部按钮的标签,该标签仅在移动端视图中显示。
## langMenuLabel
- 类型:`string`
- 默认值:`Change language`
Can be used to customize the aria-label of the language toggle button in navbar. This is only used if you're using [i18n](../guide/i18n).
用于自定义导航栏中语言切换按钮的 aria-label仅当使用 [i18n](../guide/i18n) 时才使用此选项。
## externalLinkIcon
- 类型:`boolean`
- 默认值:`false`
Whether to show an external link icon next to external links in markdown.
是否在 markdown 中的外部链接旁显示外部链接图标。

@ -15,10 +15,10 @@ export default {
```ts
export interface Footer {
// The message shown right before copyright.
// 版权前显示的信息
message?: string
// The actual copyright text.
// 实际的版权文本
copyright?: string
}
```

@ -37,21 +37,19 @@ hero:
```ts
interface Hero {
// The string shown top of `text`. Comes with brand color
// and expected to be short, such as product name.
// `text` 上方的字符,带有品牌颜色,预计简短,例如产品名称
name?: string
// The main text for the hero section. This will be defined
// as `h1` tag.
// hero 部分的主要文字,被定义为 `h1` 标签
text: string
// Tagline displayed below `text`.
// `text` 下方的标语
tagline?: string
// The image is displayed next to the text and tagline area.
// text 和 tagline 区域旁的图片
image?: ThemeableImage
// Action buttons to display in home hero section.
// 主页 hero 部分的操作按钮
actions?: HeroAction[]
}
@ -61,13 +59,13 @@ type ThemeableImage =
| { light: string; dark: string; alt?: string }
interface HeroAction {
// Color theme of the button. Defaults to `brand`.
// 按钮的颜色主题,默认为 `brand`
theme?: 'brand' | 'alt'
// Label of the button.
// 按钮的标签
text: string
// Destination link of the button.
// 按钮的目标链接
link: string
}
```
@ -119,30 +117,28 @@ features:
```ts
interface Feature {
// Show icon on each feature box.
// 在每个 feature 框中显示图标
icon?: FeatureIcon
// Title of the feature.
// feature 的标题
title: string
// Details of the feature.
// feature 的详情
details: string
// Link when clicked on feature component. The link can
// be both internal or external.
// 点击 feature 组件时的链接,可以是内部链接,也可以是外部链接。
//
// e.g. `guide/reference/default-theme-home-page` or `https://example.com`
// 例如 `guide/reference/default-theme-home-page` `https://example.com`
link?: string
// Link text to be shown inside feature component. Best
// used with `link` option.
// feature 组件内显示的链接文本,最好与 `link` 选项一起使用
//
// e.g. `Learn more`, `Visit page`, etc.
// 例如 `Learn more`, `Visit page`
linkText?: string
// Link rel attribute for the `link` option.
// `link` 选项的链接 rel 属性
//
// e.g. `external`
// 例如 `external`
rel?: string
}
@ -156,4 +152,4 @@ type FeatureIcon =
width?: string
height: string
}
```
```

@ -122,8 +122,7 @@ export default {
export default {
themeConfig: {
nav: [
// This link gets active state when the user is
// on `/config/` path.
// 当用户位于 `/config/` 路径时,该链接处于激活状态
{
text: 'Guide',
link: '/guide',

@ -116,7 +116,7 @@ export default defineConfig({
* @param {import('markdown-it')} md
*/
_render(src, env, md) {
// return html string
// 返回 html 字符串
}
}
}

@ -57,7 +57,7 @@ export default {
{
text: 'Guide',
items: [
// This shows `/guide/index.md` page.
// 显示的是 `/guide/index.md` 页面
{ text: 'Introduction', link: '/guide/' }
]
}
@ -117,8 +117,7 @@ export default {
export default {
themeConfig: {
sidebar: {
// This sidebar gets displayed when a user
// is on `guide` directory.
// 当用户位于 `guide` 目录时,会显示此侧边栏
'/guide/': [
{
text: 'Guide',
@ -130,8 +129,7 @@ export default {
}
],
// This sidebar gets displayed when a user
// is on `config` directory.
// 当用户位于 `config` 目录时,会显示此侧边栏
'/config/': [
{
text: 'Config',

@ -178,42 +178,41 @@ const partners = [...]
```ts
interface Props {
// Size of each members. Defaults to `medium`.
// 每个成员的大小,默认为 `medium`
size?: 'small' | 'medium'
// List of members to display.
// 显示的成员列表
members: TeamMember[]
}
interface TeamMember {
// Avatar image for the member.
// 成员的头像图像
avatar: string
// Name of the member.
// 成员的名称
name: string
// Title to be shown below member's name.
// e.g. Developer, Software Engineer, etc.
// 成员姓名下方的标题
// 例如:Developer, Software Engineer, etc.
title?: string
// Organization that the member belongs.
// 成员所属的组织
org?: string
// URL for the organization.
// 组织的 URL
orgLink?: string
// Description for the member.
// 成员的描述
desc?: string
// Social links. e.g. GitHub, Twitter, etc. You may pass in
// the Social Links object here.
// See: https://vitepress.dev/reference/default-theme-config.html#sociallinks
// 社交媒体链接,例如 GitHub、Twitter 等,可以在此处传入 Social Links 对象
// 参见: https://vitepress.dev/reference/default-theme-config.html#sociallinks
links?: SocialLink[]
// URL for the sponsor page for the member.
// 成员 sponsor 页面的 URL
sponsor?: string
// Text for the sponsor link. Defaults to 'Sponsor'.
// sponsor 链接的文本,默认为 'Sponsor'
actionText?: string
}
```

@ -216,6 +216,6 @@ pageClass: custom-page-class
```css
.custom-page-class {
  /* page-specific styles */
  /* 特定页面的样式 */
}
```

@ -13,23 +13,23 @@ VitePress 提供了几个内置的 API 来让你访问应用程序数据。ViteP
```ts
interface VitePressData<T = any> {
/**
* Site-level metadata
* 站点级元数据
*/
site: Ref<SiteData<T>>
/**
* themeConfig from .vitepress/config.js
* .vitepress/config.js 中的 themeConfig
*/
theme: Ref<T>
/**
* Page-level metadata
* 页面级元数据
*/
page: Ref<PageData>
/**
* Page frontmatter
* 页面 frontmatter
*/
frontmatter: Ref<PageData['frontmatter']>
/**
* Dynamic route params
* 动态路由参数
*/
params: Ref<PageData['params']>
title: Ref<string>
@ -87,24 +87,23 @@ interface Route {
```ts
interface Router {
/**
* Current route.
* 当前路由
*/
route: Route
/**
* Navigate to a new URL.
* 导航到新的 URL
*/
go: (to?: string) => Promise<void>
/**
* Called before the route changes. Return `false` to cancel the navigation.
* 在路由更改前调用。返回 `false` 表示取消导航
*/
onBeforeRouteChange?: (to: string) => Awaitable<void | boolean>
/**
* Called before the page component is loaded (after the history state is
* updated). Return `false` to cancel the navigation.
* 在页面组件加载前history 状态更新后)调用。返回 `false` 表示取消导航
*/
onBeforePageLoad?: (to: string) => Awaitable<void | boolean>
/**
* Called after the route changes.
* 在路由更改后调用
*/
onAfterRouteChanged?: (to: string) => Awaitable<void>
}

@ -16,7 +16,7 @@ outline: deep
```ts
export default {
// app level config options
// 应用级配置选项
lang: 'en-US',
title: 'VitePress',
description: 'Vite & Vue powered static site generator.',
@ -35,12 +35,12 @@ export default async () => defineConfig({
const posts = await (await fetch('https://my-cms.com/blog-posts')).json()
return {
// app level config options
// 应用级配置选项
lang: 'en-US',
title: 'VitePress',
description: 'Vite & Vue powered static site generator.',
// theme level config options
// 主题级别配置选项
themeConfig: {
sidebar: [
...posts.map((post) => ({
@ -61,12 +61,12 @@ import { defineConfig } from 'vitepress'
const posts = await (await fetch('https://my-cms.com/blog-posts')).json()
export default defineConfig({
// app level config options
// 应用级配置选项
lang: 'en-US',
title: 'VitePress',
description: 'Vite & Vue powered static site generator.',
// theme level config options
// 主题级别配置选项
themeConfig: {
sidebar: [
...posts.map((post) => ({
@ -101,7 +101,7 @@ import { defineConfig } from 'vitepress'
export default defineConfig({
themeConfig: {
// Type is `DefaultTheme.Config`
// 类型为 `DefaultTheme.Config`
}
})
```
@ -114,7 +114,7 @@ import type { ThemeConfig } from 'your-theme'
export default defineConfigWithTheme<ThemeConfig>({
themeConfig: {
// Type is `ThemeConfig`
// 类型为 `ThemeConfig`
}
})
```
@ -222,9 +222,9 @@ type HeadConfig =
```ts
export default {
head: [['link', { rel: 'icon', href: '/favicon.ico' }]]
} // put favicon.ico in public directory, if base is set, use /base/favicon.ico
} // 将 favicon.ico 放在公共目录中,如果设置了 base则使用 /base/favicon.ico
/* Would render:
/* 渲染成:
<link rel="icon" href="/favicon.ico">
*/
```
@ -249,7 +249,7 @@ export default {
]
}
/* Would render:
/* 渲染成:
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
@ -273,7 +273,7 @@ export default {
]
}
/* Would render:
/* 渲染成:
<script id="register-sw">
;(() => {
if ('serviceWorker' in navigator) {
@ -304,7 +304,7 @@ export default {
]
}
/* Would render:
/* 渲染成:
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
@ -457,13 +457,13 @@ export default {
```ts
export default {
ignoreDeadLinks: [
// ignore exact url "/playground"
// 忽略精确网址 "/playground"
'/playground',
// ignore all localhost links
// 忽略所有 localhost 链接
/^https?:\/\/localhost/,
// ignore all links include "/repl/""
// 忽略所有包含 "/repl/" 的链接
/\/repl\//,
// custom function, ignore all links include "ignore"
// 自定义函数,忽略所有包含 "ignore "的链接
(url) => {
return url.toLowerCase().includes('ignore')
}
@ -529,7 +529,7 @@ export default {
```js
export default {
vite: {
// Vite config options
// Vite 配置选项
}
}
```
@ -543,7 +543,7 @@ export default {
```js
export default {
vue: {
// @vitejs/plugin-vue options
// @vitejs/plugin-vue 选项
}
}
```
@ -613,8 +613,8 @@ export default {
```ts
interface TransformContext {
page: string // e.g. index.md (relative to srcDir)
assets: string[] // all non-js/css assets as fully resolved public URL
page: string // 例如 index.md (相对于 srcDir)
assets: string[] // 所有非 js/css 资源均作为完全解析的公共 URL
siteConfig: SiteConfig
siteData: SiteData
pageData: PageData
@ -679,7 +679,7 @@ export default {
pageData.contributors = await getPageContributors(pageData.relativePath)
}
// or return data to be merged
// 或返回要合并的数据
async transformPageData(pageData, { siteConfig }) {
return {
contributors: await getPageContributors(pageData.relativePath)

Loading…
Cancel
Save