/插入图表
自然语言出图表
中文描述图表 → LLM 出 Vega-Lite spec → 浏览器交互渲染。
::: /插入图表 引用@销售
柱状图 X 季度 Y 销售
高亮 Q4
:::
图表、流程图、插图、可交互 widget 从自然语言描述里直接长出来。一份内容,三种受众:人读、LLM 生成、agent 调用。
npx @folio-cli/folio build article.md中文描述图表 → LLM 出 Vega-Lite spec → 浏览器交互渲染。
::: /插入图表 引用@销售
柱状图 X 季度 Y 销售
高亮 Q4
:::
中文描述流程 → LLM 出 Mermaid 代码 → 浏览器渲染。
::: /插入流程图
用户登录:输入 → 校验 →
成功跳首页/失败提示
:::
LLM 从 4 个内置 widget(filterable-table / tabs / slider-calc / accordion)选一个 + 填配置。
::: /插入交互 引用@销售
可筛选可排序的销售明细
:::
MCP server 一行配置,agent 直接调 md2html_build + md2html_publish 拿 URL。
{
"mcpServers": {
"folio": {
"command": "npx",
"args": ["@folio-cli/folio-mcp"]
}
}
}
CLI + 本地 dev server。写 markdown,保存,浏览器自动刷新。
$ folio dev article.md
✓ http://localhost:5173
npm install -g @folio-cli/folio# 我的文章
::: /插入流程图
登录流程:…
:::$ folio build article.md
✓ article.html