Skip to content

Images in Markdown only load correctly on site or in editor, not both #229

@Phyroks

Description

@Phyroks

Environment

  • OS: Windows 11 Enterprise 23H2
  • Node.js: 22.18.0
  • Nuxt version: ^4.2.2
  • Docus version: latest
  • nuxt-studio: 1.0.0-beta.3

Version

v2

Reproduction

  1. Create a Markdown file.
  2. Insert an image manually without a leading slash → works on site, not in editor.
  3. Insert an image via the editor (leading slash added automatically) → works in editor, not on site.

Description

When adding images in Markdown files, they only display correctly in one of two contexts — either on the rendered site or in the Nuxt Studio editor — depending on whether the image path has a leading slash.

If I use this format:

![readme-banner](img/readme/readme-banner.png)

The image is displayed correctly on the rendered site, but not in the editor.

If I insert an image via the Nuxt Studio editor, it uses a leading slash:

![readme-banner](/img/readme/readme-banner.png)

In this case, the image displays correctly in the editor, but not on the rendered site.

Additional context

I have an environment variable that overrides the base URL. (NUXT_APP_BASE_URL)
It's possible that this affects how paths are resolved.

Logs

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions