时间线

提供 Markdown 时间线语法，在 Vitepress 中使用 Markdown 渲染时间线（时间轴）样式。

https://www.npmjs.com/package/vitepress-markdown-timeline
https://github.com/HanochMa/vitepress-markdown-timeline

安装

npm

npm install -D vitepress-markdown-timeline

yarn

yarn add -D vitepress-markdown-timeline

pnpm

pnpm add -D vitepress-markdown-timeline

bun

bun add -D vitepress-markdown-timeline

配置

App Config

// .vitepress/config.mts
import { defineConfig } from 'vitepress'

import timelineMarkdownPlugin from "vitepress-markdown-timeline"; 

export default defineConfig({
  markdown: {
    config: (md) => {
      md.use(timelineMarkdownPlugin); 
    },
  },
});

Theme Config

// .vitepress/theme/index.ts
import type { Theme } from 'vitepress';
import DefaultTheme from 'vitepress/theme';

import "vitepress-markdown-timeline/dist/theme/index.css"; 

自定义样式

/* .vitepress/theme/style.css */
.timeline-dot {
  position: relative;
  box-sizing: border-box;
  padding: 0 0 8px 24px;
  color: #adadad;
}

.timeline-dot::before {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  width: 8px;
  height: 8px;
  margin: 8px 0 0 4px;
  border-radius: 50%;
  border: solid 1px var(--vp-c-brand);
  transform: translate(0, 0);
}

.timeline-dot::after {
  position: absolute;
  left: 7px;
  top: 16px;
  content: "";
  width: 2px;
  height: calc(100% - 8px);
  background-color: #e9e9e9;
}

.timeline-dot .timeline-dot-title {
  font-size: 16px;
  font-weight: bold;
  padding-top: 0;
  color: var(--timeline-title-text);
}

.timeline-dot ul, .timeline-dot ol, .timeline-dot p {
  margin: 8px 0;
  font-size: 14px;
  color: var(--vp-c-text-1);
}

使用

李白（701年－762年），唐代著名浪漫主义诗人，被誉为“诗仙”。以下是他的生平主要时间线：

::: timeline 早年时期（701年－725年）
- 701年：出生于西域碎叶城（今吉尔吉斯斯坦托克马克附近），祖籍陇西成纪（今甘肃秦安）。
- 705年：随父迁居蜀地绵州昌隆县（今四川江油）。
- 725年：24岁，离开蜀地，开始漫游天下，写下《峨眉山月歌》等早期诗作。
:::

::: timeline 壮游与求仕（725年－742年）
1. 725年－735年：沿长江东下，游历江陵、洞庭、庐山、金陵、扬州等地，结交名士，诗名渐起。
2. 735年：在安陆娶故相许圉师孙女为妻，定居十年，写下《静夜思》《望庐山瀑布》等名篇。
3. 742年：因道士吴筠推荐，被唐玄宗召入长安，供奉翰林，为宫廷写诗作赋。
:::

::: timeline 长安时期与放逐（742年－744年）
742年－743年：在长安受玄宗赏识，但遭权贵排挤（如高力士），逐渐失意。  
744年：被“赐金放还”，离开长安，再次漫游，结识杜甫、高适，写下《行路难》《将进酒》等名作。  
:::

李白（701年－762年），唐代著名浪漫主义诗人，被誉为“诗仙”。以下是他的生平主要时间线：

早年时期（701年－725年）

• 701年：出生于西域碎叶城（今吉尔吉斯斯坦托克马克附近），祖籍陇西成纪（今甘肃秦安）。
• 705年：随父迁居蜀地绵州昌隆县（今四川江油）。
• 725年：24岁，离开蜀地，开始漫游天下，写下《峨眉山月歌》等早期诗作。

壮游与求仕（725年－742年）

1. 725年－735年：沿长江东下，游历江陵、洞庭、庐山、金陵、扬州等地，结交名士，诗名渐起。
2. 735年：在安陆娶故相许圉师孙女为妻，定居十年，写下《静夜思》《望庐山瀑布》等名篇。
3. 742年：因道士吴筠推荐，被唐玄宗召入长安，供奉翰林，为宫廷写诗作赋。

长安时期与放逐（742年－744年）

742年－743年：在长安受玄宗赏识，但遭权贵排挤（如高力士），逐渐失意。
744年：被“赐金放还”，离开长安，再次漫游，结识杜甫、高适，写下《行路难》《将进酒》等名作。