Gibt es eine gute Markdown-Javascript-Bibliothek oder -Kontrolle? [geschlossen]

89

Ich möchte eine Site erstellen, auf der der Benutzer Text eingeben und in Markdown formatieren kann. Der Grund, warum ich eine Javascript-Lösung möchte, ist, dass ich eine Live-Vorschau anzeigen möchte, genau wie bei StackOverflow.

Meine Website richtet sich jedoch nicht an Entwickler, daher wäre eine Editorsteuerung ideal.

Ich stelle fest, dass auf StackOverflow der WMD-Editor verwendet wird.

Eine schnelle Suche bei Google zeigt auch die Showdown-Bibliothek an, die meiner Meinung nach tatsächlich von WMD verwendet wird.

Gibt es noch andere Möglichkeiten? Sind WMD / Showdown bereits großartige Tools? Welche Erfahrungen haben Sie mit den verschiedenen Optionen gemacht?

javascript controls markdown

— Webmat
quelle

33

Wenn Sie nicht abgeneigt sind, Ajax zum Generieren der Live-Vorschau zu verwenden, ist markItUp! . markItUp! ist ein universeller Markup-Editor und sehr flexibel. Es bietet eine einfache Möglichkeit, einen Markup-Editor zu erstellen, bietet jedoch im Gegensatz zu WMD keine eigene Live-Vorschau.

Ich habe markItUp!, Zusammen mit einer einfachen JSP (mit MarkdownJ ) für eines meiner Open-Source-Projekte (ein Markdown-Plugin für Roller ) verwendet. Wenn Sie eine andere serverseitige Technologie verwenden, ersetzen Sie diese einfache JSP entsprechend.

Ich habe tatsächlich damit angefangen, bevor ich auf WMD gestoßen bin. Ich würde zustimmen, WMD ist großartig, wurde aber gerade erst als Open-Source-Lösung bereitgestellt und ist derzeit schwieriger, das Verhalten von anzupassen.

— myabc
quelle

MarkItUp! behandelt keine Umschalt- und Sticky-Auswahl. Dies ist mein Open-Source- Markdown- Texteditor, der auf JavaScript basiert. Es unterstützt Tastaturkürzel, benutzerdefinierte Dialoge und benutzerdefinierte

— Drop-Vorgänge

65

Wir waren ziemlich zufrieden mit WMD. Es gibt jedoch ein paar kleine Fehler. Nichts Wichtiges, aber ich würde es lieben, wenn John Fraser (der Autor) den Code Open Source machen würde, damit wir einige davon reparieren können. Er hat es versprochen, aber andere Projekte im wirklichen Leben stehen im Weg.

~~Ich melde mich jede Woche bei John. Ich werde auf dem Blog posten, sobald die WMD-Quelle endlich verfügbar ist.~~ Ich konnte John Fraser seit über einem Jahr nicht mehr kontaktieren.

Wir haben beide JavaScript Markdown-Bibliotheken als Open-Source-Version bereitgestellt

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

und die serverseitige C # Markdown-Bibliothek

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

— Jeff Atwood
quelle

Danke für die Antwort Jeff. Ich wusste nicht einmal, dass WMD nicht Open Source ist ... Ich werde meine Augen offen halten.

— Webmat

2

Was haben Sie gegen das klaffende Sicherheitsloch getan? Zum Beispiel: <div onmouseover = "alert ('hi');"> hi </ div> Das Obige funktioniert in der WMD-Demo!

— Andrewrk

1

@ superjoe30 Das Zeug wird auf dem Server gefiltert.

— Epochwolf

@ superjoe30: Siehe meta.stackexchange.com/questions/95821/… - das gleiche gilt für die JavaScript-Version

— balpha

1

@DisgruntledGoat Wenn Sie sich stackexchange.github.io ansehen , können Sie sehen, dass es in der Liste enthalten ist und das letzte Commit vor 6 Monaten war (bereits 2015).

— Loïc Faure-Lacroix

12

Ich würde markiert empfehlen , das leicht, effizient, einfach zu bedienen ist und auch GitHub Flavored Markdown (GFM) unterstützt. Es kann entweder auf Server- (NodeJS) oder Client- (Browser-) Seite verwendet werden.

— malcomwu
quelle

markiert wird noch entwickelt und die minimierte Version ist nur 23 KB groß.

— Peter T.

7

Soweit ich weiß, gibt es für Markdown wirklich keinen anderen browserbasierten Editor, zumindest keinen, der so umfangreich ist wie der WMD-Editor.

Showdown ist ein Markdown-Konverter in JS, der die Grundlage für die HTML-Vorschau von WMD bildet. Sie werden beide von http://attacklab.net/ erstellt .

Und soweit ich weiß, gab es keine großen Beschwerden über beide (zumindest nicht auf der Markdown-Mailingliste). Also mach es.

— Lasar
quelle

6

Es gibt einen namens Showdown, der derzeit hier gehostet wird: https://github.com/coreyti/showdown

Und es gibt https://github.com/evilstreak/markdown-js :)

— Bijan
quelle

4

Strapdown.js, das kürzlich veröffentlicht wurde , "macht es peinlich einfach, elegante Markdown-Dokumente zu erstellen. Keine serverseitige Kompilierung erforderlich."

— g33kz0r
quelle

3

Ich habe dies nicht getestet, aber hier ist eine andere Option:

Markdown wysiwyg

— VirtuosiMedia
quelle

3

Die Frage ist jetzt noch älter, aber auch noch relevanter, da ein Großteil des genannten Codes mehrere Jahre veraltet ist.

Ich habe jedoch einige gefunden, die immer noch aktuell zu sein scheinen:

Jquery-Markedit - Dies wurde vor einiger Zeit aus wmd-edit entfernt und für die Verwendung von jQuery überarbeitet. Scheint auf den ersten Blick gut.

EpicEditor - wird auch weiterhin gepflegt, verfügt über einen flexiblen Parser und, wie Sie unten sehen können, reagiert der Autor sehr schnell (siehe unten). Die IT scheint ebenfalls eine gute Dokumentation zu haben. Funktioniert leider nicht mit IE9.

MarkdownDeep ist eine dritte Option, die noch aktuell ist. Der interessante Punkt bei diesem ist die Unterstützung für Markdown Extra. Hat eine Abhängigkeit von JQuery (tatsächlich können Sie auch ohne JQuery implementieren). Basierend auf der .NET-Version ist die Dokumentation also stärker darauf ausgerichtet als auf die JS-Version. Dies funktioniert auch mit IE9. Es ist sehr einfach zu bedienen (mit JQuery) und sehr einfach. Soweit ich sehen kann, findet damit jedoch keine nennenswerte Entwicklung statt.

js-markdown-extra ist ein ziemlich genauer Port der PHP-Bibliothek und wird noch gewartet . Es unterstützt natürlich Markdown Extra.

— Julian Knight
quelle

1

Live-Vorschauen funktionieren gut mit meinem Editor :) Öffnen Sie den Vollbildmodus als Beispiel oder führen Sie ihn einfach preview()mit Keydown oder Timeout aus. Es wurde für jede Art von Anpassung entwickelt.

— Oscar Godson

1

Also, unter dem Editor ist, wie es jetzt funktioniert. Sobald Sie auf Vorschau klicken, wird die versteckte Vorschau angezeigt, die mit dem, was Sie geschrieben haben, aktualisiert wird. Vollbild macht es (sorta) während Sie tippen. Um Ihren eigenen Previewer zu erstellen, können

— Oscar Godson

1

Abfangen? Sie können tun: editor.on('save', function(file) { console.log(file.content) })wenn es das ist, was Sie meinen. Das spuckt den Dateiinhalt aus, wenn die Datei gespeichert wird.

— Oscar Godson

1

Möglicherweise möchten Sie auch on('update')anstelle von Speichern verwenden. Speichern wird viel ausgelöst, wenn Sie die automatische Speicherung aktiviert haben. Das Update wird nur ausgelöst, wenn sich etwas ändert. epiceditor.com/#events

— Oscar Godson

1

Zu Ihrer Information an alle, die dies lesen: github.com/OscarGodson/EpicEditor/issues/137 - Das Problem ist, dass versucht wurde, lokal ausgeführt zu werden, und dass IE9 Sicherheitsbeschränkungen gegen die lokale Verwendung von localStorage über die Datei hat: \\\

— Oscar Godson

2

Die Frage ist uralt, aber hoffentlich könnte dies jemandem helfen. Ich habe kürzlich eine funktionierende Version meines eigenen Javascript-Markdown-Editors uedit veröffentlicht . Den Quellcode finden Sie hier . Es funktioniert in den meisten Browsern (einschließlich IE6 +) und hängt nicht von externen JS-Bibliotheken ab.

— schmrz
quelle

2

Nachdem ich mit mehreren Plugins versucht hatte, meine eigenen Anforderungen an das Anbieten eines MarkDown-Seudo-WYSIWYG zu erfüllen, beendete ich die Implementierung meines eigenen:

http://fguillen.github.com/MDMagick/

Vielleicht ist es nicht so leistungsfähig wie alle hier kommentierten Lösungen, aber ich denke, dass keine so einfach und leicht zu integrieren und anzupassen ist .

— fguillen
quelle