Images not showing Azure Devops repository README when .md is rendered from R markdown

I have a repository for an R project in my organisation’s Azure Devops. I wanted to include an image in the README file, which I created with R markdown using github_document as the output. I referred to the image in the document as below:

![Fig. 1 - Parameters to select](./images/Knit_with_params.png)

where images is the name of a folder (also uploaded to my repository) that contains the image knit_with_params.png. Below this reference in the R markdown document, I can see the image. I can also see it in the HTML preview that RStudio generates when I knit the document. Looking at the README.md file, I see that my image reference has been converted to this (css?):

<figure>
<img src="/images/Knit_with_params.png"
alt="Fig. 1 - Parameters to select" />
<figcaption aria-hidden="true">Fig. 1 - Parameters to
select</figcaption>
</figure>

The problem is that when I push the README to my repository, it just shows me a placeholder instead of the image itself, despite the fact that when I look at the images folder in the repository, I can see that the image file is there, and if I click on it I can even see the image itself.

My colleague solved it by going into the README.md file and changing the css to (note also lack of . before the forward slash at the beginning of the relative path):

![Fig. 1 - Parameters to select](/images/Knit_with_params.png)

If I remove the . from the relative filepath in R markdown, it doesn’t like it – I get the following message:

(No image at path /images/Knit_with_params.png)

The css in the .md still looks exactly the same as before, but the HTML preview no longer shows the image and either way (with or without .) as long as there is css and not a relative file path in the rendered .md., the image is not visible on the README page in the repository.

This leads me to two questions:

1. Why does the css in markdown not work in Azure Devops repositories?
2. Is there a way to render the R markdown to .md but keep the relative file paths to images as is, instead of converting them to css, or do I have to go into the .md manually and change them back every time I update the readme?

You need to sign in to view this answers