515 字
3 分钟
Markdown 文件树
文件树有两种等价写法:嵌套列表(容器语法)和终端 tree 输出(代码围栏语法)。两者都会自动识别扩展名图标、支持目录折叠与变更状态标注。
容器语法:嵌套列表
效果
Shirone 目录结构
src
config
- siteConfig.ts
- sidebarConfig.ts
content
posts
- hello-world.md
- content.config.ts关键配置文件
public
- favicon.svg
- package.json
源码(容器名与花括号紧贴;每级缩进 2 个空格)
:::file-tree{title="Shirone 目录结构"}- src - config/ - siteConfig.ts - sidebarConfig.ts - content - posts/ - hello-world.md - **content.config.ts** # 关键配置文件- public/ - favicon.svg- package.json:::围栏语法:终端 tree 输出
效果
构建输出
dist
_astro
- index.css
- page.js
posts
hello-world
- index.html
- favicon.ico
源码(围栏信息串用空格分隔的 title="...",不是花括号)
```file-tree title="构建输出" icon="simple"dist├── _astro/│ ├── index.css│ └── page.js├── posts/│ └── hello-world/│ └── index.html└── favicon.ico```变更状态与标记
效果
本次改动
src
components
- +NewCard.astro新增组件
- -OldCard.astro删除组件
- Card.astro未改动
- content.config.ts重点文件
源码
:::file-tree{title="本次改动"}- src - components - ++ NewCard.astro # 新增组件 - -- OldCard.astro # 删除组件 - Card.astro # 未改动 - **content.config.ts** # 重点文件:::| 标记 | 含义 |
|---|---|
++ 名称 | 新增(绿色背景 + 徽章) |
-- 名称 | 删除(红色背景 + 删除线) |
# 文字 | 行尾注释(右对齐、弱化显示) |
**名称** | 加粗,突出关键文件 |
目录名末尾加 / | 该目录默认折叠,读者可点击展开;不加斜杠的目录默认展开 |
参数
| 参数 | 取值 | 默认 | 说明 |
|---|---|---|---|
title | 字符串(≤200 字符) | 空 | 标题栏与无障碍标签 |
icon | colored / simple | colored | 彩色扩展名图标或单色极简图标 |
分享文章
生成精美分享图或复制链接,与更多人分享本文。
继续阅读
换条路线
从其他文章中稳定抽取
最后更新于 ,距今已过 301 天
部分内容可能已过时
评论