Introduction¶
When discussing design with DSH web and models, PlantUML is a handy way to express ideas: sequence diagrams, class diagrams, and flowcharts can be described with a few lines of text, and models are easy to generate. However, by default, model output ```plantuml fence code blocks only display the source code. To see the diagram, you have to copy the source code, render it in another tool, and compare the result while continuing the discussion, breaking the flow.
dsh-plantuml solves this step: it identifies PlantUML code blocks in assistant messages, automatically renders them into SVGs, and displays them directly in the conversation. DSH’s philosophy is “everything is a plugin,” and this kind of display-layer requirement is exactly what plugins are for. Below is an introduction to its functions, installation, and configuration.
What is it¶
dsh-plantuml is a DSH web plugin maintained by qschen86, version 0.1.0, under the MIT license. In a nutshell: it renders plantuml/puml fence code blocks within conversation messages into SVG charts.
Implementation is split into two sides:
- The Host side
lib/index.jsprovides aPOST /plugin/plantumlrendering interface, encoding according to PlantUML’s official encoding (deflate + custom base64) to request a remote service, or it can call the localplantumlcommand; - The Browser side
lib/client.jsregisters a low-priority renderer forassistant-stepinconversation.chat.node. While retaining the display of original Markdown / reasoning / images / JSON, it parses PlantUML fences and asynchronously loads images.
Core Features¶
- Identify
plantuml/pumlfence code blocks in assistant messages and automatically render them into SVGs via PlantUML services (default public server, configurable); - Support for architecture diagrams, flowcharts, sequence diagrams, use case diagrams, class diagrams, etc.;
- Display error messages when rendering fails without blocking other Markdown content in the message;
- Server address, local
plantumlcommand, timeout, and source size limit can all be configured via environment variables.
Installation and Enablement¶
Installation command:
dsh plugin --profile web add dsh-plantuml
Alternatively, you can use the GitHub Release tarball:
dsh plugin --profile web add https://github.com/qschen86/dsh-plantuml/releases/download/v0.1.0/dsh-plantuml-0.1.0.tgz
After installation, verify the configuration first:
dsh --profile web --dump-config
Confirm the plugin entry has been added to bundles, then restart dsh web (host half-effective), and then refresh the page (client half-effective). Uninstall using the corresponding command:
dsh plugin --profile web remove dsh-plantuml
Typical Usage¶
Ask the model to output PlantUML source code in its reply, for example:
```plantuml
@startuml
Alice -> Bob: 你好
@enduml
```
The plugin will automatically replace this code with the rendered SVG image, allowing you to see the diagram directly in the message without manual intermediate steps.
Configuration¶
The plugin is configured via environment variables. The default values are as follows:
| Variable | Default Value | Description |
|---|---|---|
DSH_PLANTUML_SERVER |
https://www.plantuml.com/plantuml |
PlantUML service address, e.g., self-hosted http://127.0.0.1:8080/plantuml |
DSH_PLANTUML_COMMAND |
Empty | Set to the local plantuml command (or executable file path) to prioritize local rendering, avoiding network access |
DSH_PLANTUML_TIMEOUT_MS |
15000 |
Remote rendering timeout (milliseconds) |
DSH_PLANTUML_MAX_SOURCE |
1048576 |
Maximum byte size of a single PlantUML source code |
A common pitfall: environment variables must be visible to the dsh web process. If the service is managed by a launchd supervised process (e.g., com.dsh.web-supervisor), you need to write the variables into its plist’s EnvironmentVariables (or use the DSH_START_CMD prefix); writing only to ~/.zshrc will not take effect.
Use Cases and Notes¶
Suitable scenarios:
- Frequently asking models to draw sequence diagrams, class diagrams, or architecture diagrams, hoping the diagrams appear directly in the conversation;
- Wanting rendering to be self-hosted or using a local command, not dependent on third-party online editors for transit.
Notes before use:
- The renderer priority for this plugin is
-5forassistant-step. If the browser renderer fromdsh-llm-codex-app-serveris also installed (priority-10), the latter will take over assistant messages first. In this case, if PlantUML rendering is needed, it is recommended to merge the two rendering sets or choose one. - It defaults to the PlantUML public server, so the chart source code will be sent to an external service. For scenarios sensitive to content, you can self-host a service (modify
DSH_PLANTUML_SERVER) or setDSH_PLANTUML_COMMANDto use the local command. - The plugin runs with the permissions of the current dsh process. It is recommended to check the source code and license before installing.
Conclusion¶
dsh-plantuml does one thing: turn PlantUML code blocks in the conversation into diagrams. For DSH users who frequently draw diagrams using text, it saves the step of copying and pasting intermediates.
- Project URL: https://github.com/qschen86/dsh-plantuml
- Community directory page: https://www.skillhub.cn/plugins/qschen86/dsh-plantuml
(skillhub.cn is an independent directory site maintained by the community, with no official affiliation with DeepSeek / Huafan.)