Need Help with Nuxt Content and Styled Text in YAML
Hello everyone,
I'm encountering an issue with my Nuxt.js project that uses Nuxt Content. Here's a summary of my situation and what I need:
Context
- I'm using pre-built components like UlandingHero in my Nuxt project.
- I want to separate text content from my code by using YAML files located in the
content/
directory.
- My goal is to import this YAML content into my Vue components.
- I'm using YAML for easier future support of multiple languages.
Problem
- I want to add styles (such as bold or italic words) and more complex styles, such as gradient effects on words in my title. in the text from my YAML file.
- Using HTML or Markdown doesn't work directly within the .yml file.
What I Have Tried
Using v-html:
- I considered using v-html to render HTML content, but this poses security risks (XSS).3 Replies
Well and why don't you use
.md
files?
I didn't find anything that would potentially block that approach.Thanks for the answer, how would you do it for the index.yml of the SaaS template ?
https://github.com/nuxt-ui-pro/saas/blob/main/content/0.index.yml
the goal here is to maintain a clear text for translation later in multiple language
GitHub
saas/content/0.index.yml at main · nuxt-ui-pro/saas
A SaaS template made with Nuxt UI Pro. Contribute to nuxt-ui-pro/saas development by creating an account on GitHub.
maybe v-html is the way but i'm not a security guy don't know how it could go wrong doing this