I am generating a TechDocs site for my Backstage server using the recommended approach with the techdocs-cli generate and publish commands in a CI/CD pipeline. I am also using the kroki plugin. My mkdocs.yaml includes the following:
plugins:
- techdocs-core
- kroki:
DownloadImages: true
FencePrefix: ''
HttpMethod: POST
ServerURL: http://localhost:8000
The generated .html files include links to generated images that look like <img alt="Kroki" src="/images/kroki_generated/<file>-<hash>.svg" />. Those svg files are present in the images/kroki_generated directory and the whole directory structure is published to an Azure storage account.
My Backstage server is deployed with the app-backend plugin and I'm accessing it at the root of a domain like https://techhub.example.com/
When I go to the page in the docs site in backstage, for example https://techhub.example.com/docs/default/component/<component name>/<document>/, the images are broken. The browser devtools are showing requests to https://techhub.example.com/images/kroki_generated/<file>-<hash>.svg which returns the Backstage app's home page HTML rather than retrieving the actual svg through the techdocs backend API.
How can I get the combination of TechDocs, MkDocs and the kroki plugin to work together properly?
This was caused by a defect in the MkDocs Kroki plugin which was fixed with https://github.com/AVATEAM-IT-SYSTEMHAUS/mkdocs-kroki-plugin/pull/20