配置系统

相关源文件

• cypress/integration/rendering/errorDiagram.spec.js
• cypress/integration/rendering/xyChart.spec.js
• demos/error.html
• docs/syntax/xyChart.md
• packages/mermaid/src/Diagram.ts
• packages/mermaid/src/__mocks__/mermaidAPI.ts
• packages/mermaid/src/config.type.ts
• packages/mermaid/src/defaultConfig.ts
• packages/mermaid/src/diagram-api/detectType.ts
• packages/mermaid/src/diagram-api/diagram-orchestration.ts
• packages/mermaid/src/diagram-api/diagramAPI.spec.ts
• packages/mermaid/src/diagram-api/diagramAPI.ts
• packages/mermaid/src/diagram-api/types.ts
• packages/mermaid/src/diagram.spec.ts
• packages/mermaid/src/diagrams/error/errorDiagram.ts
• packages/mermaid/src/diagrams/error/errorRenderer.ts
• packages/mermaid/src/diagrams/xychart/chartBuilder/components/axis/baseAxis.ts
• packages/mermaid/src/diagrams/xychart/chartBuilder/components/axis/linearAxis.ts
• packages/mermaid/src/diagrams/xychart/chartBuilder/components/plot/barPlot.ts
• packages/mermaid/src/diagrams/xychart/chartBuilder/components/plot/linePlot.ts
• packages/mermaid/src/diagrams/xychart/chartBuilder/interfaces.ts
• packages/mermaid/src/docs/syntax/xyChart.md
• packages/mermaid/src/mermaid.spec.ts
• packages/mermaid/src/mermaid.ts
• packages/mermaid/src/mermaidAPI.spec.ts
• packages/mermaid/src/mermaidAPI.ts
• packages/mermaid/src/schemas/config.schema.yaml
• packages/mermaid/src/styles.ts

配置系统通过分层、由模式驱动的方法管理 Mermaid 图表的自定义和渲染。它处理来自多种来源的配置，包括 JSON Schema 定义、用户提供的设置、图表 frontmatter 和运行时指令。有关使用此配置的渲染管道的信息，请参阅 渲染管道。

架构概述

配置系统围绕一个核心 JSON Schema 构建，该 Schema 生成 TypeScript 类型和默认值，并采用分层合并系统，允许在多个级别指定配置。

配置系统组件

来源：packages/mermaid/src/schemas/config.schema.yaml1-30 packages/mermaid/src/config.type.ts1-20 packages/mermaid/src/defaultConfig.ts1-30 packages/mermaid/src/mermaidAPI.ts53-58

核心配置接口

MermaidConfig 接口作为核心配置契约，包含了全局设置和特定于图表的配置。

配置类别	类型	目的
全局设置	theme、logLevel、securityLevel	系统范围的行为
布局选项	layout、look、maxEdges	渲染引擎选择
字体配置	fontFamily、altFontFamily、fontSize	排版设置
特定于图表	flowchart、sequence、gantt 等。	每个图表类型的配置
安全设置	secure、arrowMarkerAbsolute	安全和清理
主题变量	themeVariables、themeCSS	自定义样式

来源：packages/mermaid/src/config.type.ts58-213 packages/mermaid/src/schemas/config.schema.yaml59-317

配置来源和层级

配置值按特定优先级顺序从多个来源合并，后来的来源会覆盖较早的来源。

配置合并层级

来源：packages/mermaid/src/mermaidAPI.ts53-58 packages/mermaid/src/mermaidAPI.ts479-506 packages/mermaid/src/assignWithDepth.ts1-50

配置源处理

processAndSetConfigs() 函数处理从图表文本中提取和应用配置。

来源：packages/mermaid/src/mermaidAPI.ts53-58 packages/mermaid/src/preprocess.js1-100

基于 Schema 的类型生成

配置系统使用 JSON Schema 作为配置结构的唯一事实来源，生成 TypeScript 类型和默认值。

Schema 到代码的生成管道

来源：packages/mermaid/src/schemas/config.schema.yaml1-30 packages/mermaid/src/config.type.ts1-10 packages/mermaid/src/defaultConfig.ts6-10

特定于图表的配置结构

每种图表类型都有自己的配置部分，该部分扩展了 BaseDiagramConfig。

来源：packages/mermaid/src/config.type.ts309-318 packages/mermaid/src/config.type.ts220-304 packages/mermaid/src/config.type.ts325-460 packages/mermaid/src/config.type.ts468-545

配置处理管道

配置系统通过一个多阶段管道处理设置，该管道负责合并、验证和应用。

运行时配置流程

来源：packages/mermaid/src/mermaidAPI.ts479-506 packages/mermaid/src/Diagram.ts17-46 packages/mermaid/src/mermaidAPI.ts159-172

配置合并过程

assignWithDepth() 函数执行配置对象的深度合并。

来源：packages/mermaid/src/assignWithDepth.ts1-50 packages/mermaid/src/mermaidAPI.ts480-490

主题和样式配置

配置系统与主题系统集成，提供可自定义的视觉样式。

主题配置集成

来源： packages/mermaid/src/mermaidAPI.ts109-157 packages/mermaid/src/mermaidAPI.ts159-172 packages/mermaid/src/styles.ts7-102

安全配置

配置系统包含安全控制，以防止恶意配置覆盖。

安全配置控制

设置	目的	默认
securityLevel	控制 HTML 清理级别	'strict'
secure	列出受保护的配置键	['secure', 'securityLevel', ...]
suppressErrorRendering	控制错误图表显示	false
maxTextSize	限制输入文本大小	50000
maxEdges	限制图表复杂性	500

secure 数组可防止图表指令覆盖关键安全设置

来源： packages/mermaid/src/schemas/config.schema.yaml206-223 packages/mermaid/src/config.type.ts128-148 packages/mermaid/src/mermaidAPI.ts318-322