Есть ли хорошая библиотека или элемент управления Markdown Javascript? [закрыто]


89

Я хочу создать сайт, на котором пользователь может вводить текст и форматировать его в Markdown. Причина, по которой мне нужно решение Javascript, заключается в том, что я хочу отображать предварительный просмотр в реальном времени, как и в StackOverflow.

Однако мой сайт не ориентирован на разработчиков, поэтому элемент управления редактором был бы идеальным.

Я так понимаю, что в StackOverflow используется редактор WMD.

Быстрый поиск в Google также обнаруживает библиотеку Showdown, которая, как мне кажется, действительно используется WMD.

Есть ли другие варианты? WMD / Showdown уже являются отличными инструментами? Каковы были ваши впечатления от различных вариантов?

Ответы:


33

Если вы не прочь использовать Ajax для создания предварительного просмотра в реальном времени, то другой вариант - markItUp! . markItUp! это универсальный редактор разметки, и очень гибкий. Он предоставляет простой способ создания редактора разметки, но, в отличие от WMD, он не предоставляет собственного предварительного просмотра в реальном времени.

Я использовал markItUp !, вместе с простым JSP (с использованием MarkdownJ ) для одного из моих проектов с открытым исходным кодом ( плагин Markdown для Roller ). Если вы используете другую серверную технологию, замените этот простой JSP соответствующим образом.

Я начал использовать это до того, как наткнулся на ОМП. Я согласен, WMD - это здорово, но он только что получил открытый исходный код, и на данном этапе его поведение сложнее настроить.


MarkItUp! не поддерживает переключение и закрепление выделения. Это мой текстовый редактор Markdown с открытым исходным кодом, основанный на JavaScript. Он поддерживает горячие клавиши, пользовательские диалоги, пользовательские капли, а также поддерживает некоторое умный Tidy выделения текста , чтобы поощрить пользователь писать Markdown синтаксис в формате хорошего: github.com/tovic/markdown-text-editor
Тауфик Nurrohman

65

Мы очень довольны ОМП. Однако в нем есть несколько мелких ошибок. Ничего серьезного, но я бы любить , если Джон Фрейзер (автор) сделал код с открытым исходным кодом , чтобы мы могли исправить некоторые из них. Он обещал сделать это, но ему мешают другие проекты из реальной жизни.

Я общаюсь с Джоном каждую неделю. Я опубликую в блоге, как только источник ОМП станет наконец доступен. Больше года не могу связаться с Джоном Фрейзером.

Мы открыли исходный код библиотеки JavaScript Markdown

http://code.google.com/p/pagedown/

и серверная библиотека C # Markdown

http://code.google.com/p/markdownsharp/


Спасибо за ответ Джефф. Я даже не понимал, что ОМП не является открытым исходным кодом ... Я буду следить за этим.
webmat

2
Что вы сделали с зияющей дырой в безопасности? Например: <div onmouseover = "alert ('hi');"> привет </div> Вышеупомянутое работает в демоверсии WMD!
andrewrk

1
@ superjoe30 Этот материал фильтруется на сервере.
epochwolf

@ superjoe30: См. meta.stackexchange.com/questions/95821/… - то же самое относится и к версии JavaScript
balpha

1
@DisgruntledGoat, глядя на stackexchange.github.io, вы можете увидеть, что он в списке, а последняя фиксация была 6 месяцев назад (уже 2015 год).
Лоик Фор-Лакруа,

12

Я бы порекомендовал отметить , что он легкий, эффективный, простой в использовании и также поддерживает GitHub Flavored Markdown (GFM). Его можно использовать как на стороне сервера (nodejs), так и на стороне клиента (браузер).


отмеченный, все еще находится в разработке, а размер уменьшенной версии составляет всего 23 КБ.
Питер Т.

7

Насколько я знаю, для Markdown действительно нет другого браузерного редактора, по крайней мере, такого обширного, как редактор WMD.

Showdown - это конвертер Markdown в JS, который составляет основу HTML-превью WMD. Оба они сделаны http://attacklab.net/ .

И, насколько мне известно, не было никаких серьезных претензий к обоим (по крайней мере, в списке рассылки Markdown). Так что дерзайте.



4

Strapdown.js, который был недавно выпущен , «упрощает создание элегантных документов Markdown. Компиляция на стороне сервера не требуется».



3

Этот вопрос стал еще более древним, но еще более актуальным, поскольку большая часть упомянутого кода устарела на несколько лет.

Тем не менее, я нашел несколько, которые все еще кажутся актуальными:

Jquery-Markedit - это был ветвь wmd-edit некоторое время назад и переработан для использования jQuery. На первый взгляд кажется неплохим.

EpicEditor - также поддерживается, имеет гибкий парсер и, как вы можете видеть ниже, автор очень отзывчивый (см. Ниже). У ИТ-отдела тоже есть хорошая документация. К сожалению, не работает с IE9.

MarkdownDeep - это третий вариант, который все еще актуален. Интересным моментом здесь является поддержка Markdown Extra. Имеет зависимость от JQuery (на самом деле вы также можете реализовать без JQuery). На основе версии .NET, поэтому документация более согласована с ней, чем версия JS. Это также работает с IE9. Это очень легко использовать (с JQuery) и очень просто. Насколько я могу судить, здесь не происходит значительного развития событий.

js-markdown-extra - это довольно точный порт библиотеки PHP, который все еще находится на обслуживании. Конечно, он поддерживает Markdown Extra.


1
Предварительный просмотр в реальном времени отлично работает с моим редактором :) Откройте полноэкранный режим в качестве примера или просто запускайте preview()при нажатии клавиши или тайм-ауте. Он создан для любых настроек.
Oscar Godson

1
Итак, под редактором вот как это работает сейчас. После того, как вы нажмете «Предварительный просмотр», отобразится скрытый предварительный просмотр, в котором будет добавлено то, что вы написали. Полноэкранный режим делает это (вроде как) по мере ввода. Чтобы создать свой собственный предварительный просмотр, вы можете сделать что-то вроде этого: jsbin.com/otuyub/edit#javascript,html
Oscar Godson

1
Перехватить? Вы можете сделать: editor.on('save', function(file) { console.log(file.content) })если это вы имеете в виду. Это будет выплевывать содержимое файла всякий раз, когда файл будет сохранен.
Oscar Godson

1
Кроме того, вы можете использовать on('update')вместо сохранения. Сохранение будет много работать, если у вас включено автосохранение. Обновление сработает только тогда, когда что-то изменится. epiceditor.com/#events
Oscar Godson

1
К вашему сведению, всем, кто читает это: github.com/OscarGodson/EpicEditor/issues/137 - проблема в том, что он пытался запускаться локально, а IE9 имеет ограничения безопасности на использование localStorage локально через файл: \\\
Оскар Годсон

2

Вопрос древний, но, надеюсь, это может кому-то помочь. Недавно я опубликовал рабочую версию моего собственного редактора разметки Javascript, uedit . Вы можете найти исходный код здесь . Он работает в большинстве браузеров (включая IE6 +) и не зависит от каких-либо внешних JS-библиотек.


2

Попробовав несколько плагинов для решения моих собственных потребностей в предложении Seudo-WYSIWYG MarkDown, я закончил реализацию своего собственного:

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

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.