Установка и подключение

Marked — это высокопроизводительная библиотека для преобразования текста в формате Markdown в HTML. Для начала работы необходимо установить библиотеку и корректно её подключить к проекту.

Установка через npm

Самый распространённый способ установки Marked — через менеджер пакетов npm. В командной строке проекта выполняется следующая команда:

npm install marked

После завершения установки в папке node_modules появится директория с библиотекой, а также обновится файл package.json, где она будет указана как зависимость:

"dependencies": {
  "marked": "^6.0.0"
}

Установка через yarn

Альтернативный вариант — использовать менеджер пакетов yarn:

yarn add marked

Команда добавляет библиотеку в зависимости проекта и делает её доступной для импорта.

Подключение в Node.js

После установки библиотеку можно подключить в коде через require или import в зависимости от используемой системы модулей:

С использованием CommonJS:

const marked = require('marked');

С использованием ES-модулей:

import { marked } from 'marked';

При использовании ES-модулей важно, чтобы в package.json был установлен флаг "type": "module".

Подключение через CDN в браузере

Для быстрого тестирования или работы без сборщика модулей можно подключить библиотеку напрямую через CDN. Например:

<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>

После подключения глобальная переменная marked становится доступной в браузере:

const html = marked('# Заголовок 1');
console.log(html);

Проверка установки

Для убедительности корректность установки можно проверить простым примером:

import { marked } from 'marked';

const markdownText = `
# Заголовок
Это пример текста на Markdown.
- Пункт 1
- Пункт 2
`;

const htmlOutput = marked(markdownText);
console.log(htmlOutput);

В консоли появится HTML-структура:

<h1>Заголовок</h1>
<p>Это пример текста на Markdown.</p>
<ul>
<li>Пункт 1</li>
<li>Пункт 2</li>
</ul>

Настройка путей и интеграция с сборщиками

При использовании сборщиков вроде Webpack или Vite важно убедиться, что библиотека корректно обрабатывается системой модулей. Обычно достаточно стандартного импорта, но для браузерной сборки можно настроить alias или указать optimizeDeps в конфигурации Vite для ускорения загрузки.

Особенности версий

Marked активно развивается, поэтому версии могут отличаться по API. Наиболее актуальные версии поддерживают:

  • ES-модули;
  • TypeScript типизацию;
  • Асинхронные парсеры для больших текстов;
  • Расширяемые рендереры и лексеры.

Для стабильной работы рекомендуется использовать последнюю LTS-версию Node.js и проверять совместимость с установленной версией Marked.

Подключение с TypeScript

Для проектов на TypeScript после установки Marked типы уже встроены. Пример использования:

import { marked } from 'marked';

const markdown: string = '# Пример Markdown';
const html: string = marked(markdown);

TypeScript корректно проверяет типы входных данных и возвращаемого результата, что упрощает интеграцию библиотеки в крупные проекты.

Итоговая структура проекта

После установки и подключения структура минимального проекта может выглядеть следующим образом:

project/
│
├─ node_modules/
├─ package.json
├─ package-lock.json
└─ index.js

В index.js осуществляется импорт библиотеки и преобразование Markdown в HTML, что позволяет использовать Marked как основной инструмент для работы с текстовыми форматами.

Оглавление