Cannot render markdown strings stored in a yaml file

Environment

---

• Operating System: Linux
• Node Version: v16.18.0
• Nuxt Version: 3.0.0-rc.11
• Nitro Version: 0.5.4
• Package Manager: npm@8.19.2
• Builder: vite
• User Config: -
• Runtime Modules: -
• Build Modules: -

---

Reproduction

1. yaml file in the content folder with a key value pair that contains markdown syntax (~/content/file.yml)
   • title: test file
   • description: this has **markdown**
2. access the data in the vue template:

let { data } = await useAsyncData(() => { return queryContent("file".findOne();

1. Render the description into html:

<p><ContentRendererMarkdown :value="data.description" />

Output:

Describe the bug

The hope is to be able to send the markdown syntax into the template from the yaml file as just a string and to render it.

I’ve tried a few ways, this felt like it would have been the most logical however it doesn’t convert the markdown into html.

Additional context

A major reason for why we are using this workflow is to integrate with Netlify CMS as a simple UI for non-technical contributors to help out (this is for a website for the Fedora Project).

Logs

No response

[farnabaz]

This is not possible at the time, supporting this feature means that we should ship whole markdown parser into browser which creates two issues:

• Increasing bundle size
• Increase render time and affects website’s performance

If you have a specific structure and you want to render markdown from description field. You can create custom transformer for .yaml files and parse the field, then you will be able to use ContentRendererMarkdown to render the description.

Here is simple example:

import { defineTransformer, transformContent } from '@nuxt/content/transformers'
export default defineTransformer({
  name: 'my-transformer',
  extensions: ['.yaml'],
  async parse (id, rawContent) {
    const yamlObject = transformContent(id, rawContent)
    if (yamlObject.description) {
      yamlObject._description = await transformContent('content:dummy.md', yamlObject.description)
    }
    return yamlObject
  }
})

[ManasMadrecha]

@farnabaz Oh, so in V2, it’s more intelligent, nice 😋 thanks for the detailed information and your invaluable contributions.