Integrar Markdown en Pug

Markdown es un lenguaje de marcado que, con una sintaxis muy sencilla, te permite escribir HTML, por ello es recomendable para blogs y páginas que cuentan con muchas entradas de texto.

Un pequeño ejemplo de lo que puede hacer Markdown :

1# Titulo 
2Hola **EDcomunidad**, soy un párrafo escrito con *Markdown*

Devuelve el siguiente código HTML

<h1>Título</h1>
<p>Hola <strong>EDcomunidad</strong>, soy un párrafo escrito con <em>Markdown</em>.

Para convertir Markdown a HTML necesitas una herramienta como https://dillinger.io/ también existen librerías o plugins para tu editor de código favorito. 

Puedes ver la sintaxis completa de Markdown en Github.

Integrando Markdown con Pug

Pug es otro lenguaje que permite escribir HTML con una sintaxis sencilla (a diferencia de Markdown, con Pug se puede programar). Pug por sí solo no interpreta la sintaxis de Markdown. Es decir, no podemos hacer include docs.md dentro de un archivo .pug porque nos lanzará un error. Sin embargo tenemos a Markdown-it un filtro de pug que "parsea" (analiza) la sintaxis Markdown y la renderiza en formato html.

Para instalarlo usa el siguiente comando en la terminal.

1npm install --save-dev jstransformer-markdown-it

Ahora, existen 3 formas de integrar markdown a tu proyecto con pug.

Colocando directamente el filtro :markdown-it y escribiendo dentro de el.

1:markdown-it
2    Hola humano, este es un **párrafo**. Además este es un link [Google] (http://google.com)

Puedes escribir HTML estándar dentro de markdown usando el parámetro html

:markdown-it(html)
    ##Hola humano, este no es un **párrafo** es un h2    
    <p>Soy un elemento HTML dentro de Markdown </p>

O incluyendo un archivo .md (extensión Markdown) en tu archivo pug:

include:markdown-it(html) md/docs/example.md

Como ves, es muy sencillo de usar ¡Espero que lo uses en muchos proyectos!

Gracias por leer.