Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

356
Vistas
How to render "markdowns with html" in a template of vue using 'vue3-markdown-it' or other dependency?

I'm using "vue3-markdown-it": "^1.0.10" as dependency to be able to render markdown content in my components of vue.

I added the following in vue.config.json to enable the dependency on the project

configureWebpack: {
    module: {
      rules: [
        {
          test: /\.md$/i,
          loader: "raw-loader",
        },
      ],
    },
}

And I have the following content in Home.vue

<template>
...
<Markdown :source="indice" class="indice"/>
<Markdown :source="home"/>
...
</template>

<script>
...
import home_md from '@/markdown/home.md';
import indice_md from '@/markdown/indice.md';
...
data: function() {
    return {
      home: home_md,
      indice: indice_md
    }
  },
...
</script>

And in the markdown file home.md I have

...
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

<img src="https://wpdirecto.com/wp-content/uploads/2017/08/alt-de-una-imagen.png"></img>

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
...

But it only renders all the markdown syntax, but the html doesn't render for me like it does on github, for example (which is what I'm looking to do)

output preview

Is there a way to render as html all that string that it ignores, in addition to rendering the entire markdown part?

I understand that instead of using <img src="..."></img> I can use ![](...) but this is just an example of a need I will need later when using <div>

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda