Как использовать markdown разметку в PUG

Две строчки кода и готово! Когда используешь pug,  в качестве шаблонизатора, или препроцессора, наступает такой момент что нужно разместить статью, а может и не одну. В форматировании статьи — сам PUG конечно минимален, но все же хочется чего-то еще более простого и удобного для форматирования текста. И что может быть лучше, чем старый добрый старина markdown!)

1. Подключаем markdown файлы в pug

Подключить, а точнее за-инклудить .md файлы в pug очень просто. Также как и обычный .pug или .html. Только при подключении стоит указывать особый фильтр, чтобы pug преобразовал markdown разметку в привычный HTML.

Подключаем через include с указанием фильтра:

include:markdown-it article.md

Пример страницы:

//- index.pug
doctype html
html
  head
    title An Article
  body
    include:markdown-it article.md

Документация раз

2. Установка md фильтра для pug

Сам по себе pug не умеет обрабатывать markdown разметку, поэтому надо установить дополнительный фильтр. Делается это также просто. Плюс одна зависимость в ваш проект.

Устанавливаем markdown фильтр для pug в проект:

npm install --save jstransformer-markdown-it

Документация два

Готово!) Поздравляю, теперь можно писать статьи в MD и подключать их к себе в проект.

Вот как это выглядит у меня в проекте.

Структура проекта и markdown файлы в проекте

Подключение md разметки в pug файлы