Existe-t-il une bonne bibliothèque ou contrôle Javascript Markdown? [fermé]

89

Je souhaite créer un site sur lequel l'utilisateur peut saisir du texte et le mettre en forme dans Markdown. La raison pour laquelle je souhaite une solution Javascript est que je souhaite afficher un aperçu en direct, comme sur StackOverflow.

Mon site n'est cependant pas destiné aux développeurs, donc un contrôle éditeur serait idéal.

Je suppose que sur StackOverflow, l'éditeur WMD est utilisé.

Une recherche rapide sur Google ouvre également la bibliothèque Showdown, qui, je pense, est en fait utilisée par WMD.

Il y a-t-il des alternatives? Est-ce que WMD / Showdown est déjà d'excellents outils? Quelles ont été vos expériences avec les différentes options?

javascript controls markdown webmat
la source

Réponses:

33

Si vous n'êtes pas opposé à l'utilisation d'Ajax pour générer l'aperçu en direct, une autre option est markItUp! . markItUp! est un éditeur de balisage universel et très flexible. Il fournit un moyen simple de créer un éditeur de balisage, mais contrairement à WMD, il ne fournit pas son propre aperçu en direct.

J'ai utilisé markItUp !, avec une simple JSP (utilisant MarkdownJ ) pour l'un de mes projets open-source (un plugin Markdown pour Roller ). Si vous utilisez une autre technologie côté serveur, remplacez cette simple JSP le cas échéant.

J'ai commencé à l'utiliser avant de tomber sur WMD. Je suis d'accord, WMD est génial, mais vient juste d'être open-source et il est, à ce stade, plus difficile de personnaliser le comportement de.

myabc
la source
MarkItUp! ne gère pas le basculement et la sélection persistante. Ceci est mon éditeur de texte open-source Markdown basé sur JavaScript. Il prend en charge les raccourcis clavier, les dialogues personnalisés, les suppressions personnalisées et prend également en charge une sélection de texte intelligente pour encourager les utilisateurs à écrire la syntaxe Markdown dans un bon format: github.com/tovic/markdown-text-editor
Taufik Nurrohman
65

Nous avons été plutôt satisfaits de WMD. Il y a cependant quelques bugs insignifiants. Rien de majeur, mais j'aime si John Fraser (l'auteur) a fait le code open source afin que nous puissions corriger certains d'entre eux. Il a promis de le faire, mais d'autres projets réels se mettent en travers du chemin.

Je fais un suivi avec John chaque semaine. Je publierai sur le blog une fois que la source WMD sera enfin disponible. Je n'ai pas pu contacter John Fraser depuis plus d'un an maintenant.

Nous avons ouvert la bibliothèque JavaScript Markdown

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

et la bibliothèque C # Markdown côté serveur

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

Jeff Atwood
la source
Merci pour la réponse Jeff. Je n'avais même pas réalisé que WMD n'était pas open source ... Je garderai les yeux ouverts.
webmat
2
Qu'avez-vous fait à propos de la faille de sécurité béante? Par exemple: <div onmouseover = "alert ('hi');"> hi </div> Ce qui précède fonctionne dans la démo WMD!
andrewrk
1
@ superjoe30 Ce truc est filtré sur le serveur.
epochwolf
@ superjoe30: Voir meta.stackexchange.com/questions/95821/… - il en va de même pour la version JavaScript
balpha
1
@DisgruntledGoat en regardant stackexchange.github.io vous pouvez voir qu'il est dans la liste et que le dernier commit remonte à 6 mois (2015 déjà).
Loïc Faure-Lacroix
12

Je recommanderais marqué , qui est léger, efficace, facile à utiliser et prend également en charge GitHub Flavored Markdown (GFM). Il peut être utilisé soit du côté serveur (nodejs), soit côté client (navigateur).

Malcomwu
la source
marqué est toujours en cours de développement et la version réduite ne fait que 23 Ko.
Peter T.
7

Autant que je sache, il n'y a vraiment aucun autre éditeur basé sur un navigateur pour Markdown, du moins aucun aussi complet que l'éditeur WMD.

Showdown est un convertisseur Markdown dans JS, qui forme la base de l'aperçu HTML de WMD. Ils sont tous deux créés par http://attacklab.net/ .

Et pour autant que je sache, il n'y a pas eu de grosses plaintes sur les deux (du moins pas sur la liste de diffusion Markdown). Alors allez-y.

Lasar
la source
4

Strapdown.js, qui a été récemment publié , "rend la création de documents Markdown élégants d'une simplicité embarrassante. Aucune compilation côté serveur n'est requise."

g33kz0r
la source
3

La question est encore plus ancienne maintenant mais aussi encore plus pertinente car une grande partie du code mentionné est dépassée depuis plusieurs années.

Cependant, j'en ai trouvé quelques-uns qui semblent toujours actuels:

Jquery-Markedit - Cela a été dérivé de wmd-edit il y a un certain temps et remanié pour utiliser jQuery. Semble bon à première vue.

EpicEditor - est également toujours maintenu, a un analyseur flexible et, comme vous pouvez le voir ci-dessous, l'auteur est très réactif (voir ci-dessous). Il semble également avoir une bonne documentation. Malheureusement, ne fonctionne pas avec IE9.

MarkdownDeep est une troisième option qui est toujours d'actualité. Le point intéressant avec celui-ci est le support de Markdown Extra. A une dépendance sur JQuery (en fait, vous pouvez également implémenter sans JQuery). Basé sur la version .NET, la documentation est plus alignée sur cela que la version JS. Cela fonctionne également avec IE9. Il est très facile à utiliser (avec JQuery) et très simple. Aucun développement significatif ne se produit avec cela, pour autant que je puisse le voir.

js-markdown-extra est un portage assez précis de la bibliothèque PHP et est toujours en maintenance. Il prend en charge Markdown Extra bien sûr.

Julian Knight
la source
1
Les aperçus en direct fonctionnent très bien avec mon éditeur :) ouvrez le plein écran comme exemple ou exécutez simplement preview()sur keydown ou un timeout. Il est conçu pour tout type de personnalisation.
Oscar Godson
1
Donc, sous l'éditeur, c'est comment cela fonctionne maintenant. Une fois que vous cliquez sur Aperçu, il affiche l'aperçu caché qui est mis à jour avec ce que vous avez écrit. Le plein écran le fait (en quelque sorte) au fur et à mesure que vous tapez. Pour créer votre propre aperçu, vous pouvez faire quelque chose comme ceci: jsbin.com/otuyub/edit#javascript,html
Oscar Godson
1
Intercepter? Vous pouvez le faire: editor.on('save', function(file) { console.log(file.content) })si c'est ce que vous voulez dire. Cela crachera le contenu du fichier chaque fois que le fichier est enregistré.
Oscar Godson
1
En outre, vous souhaiterez peut-être utiliser on('update')au lieu d'enregistrer. La sauvegarde se déclenchera beaucoup si vous avez activé la sauvegarde automatique. La mise à jour ne se déclenchera que lorsque quelque chose change. epiceditor.com/#events
Oscar Godson
1
Pour info à toute personne lisant ceci: github.com/OscarGodson/EpicEditor/issues/137 - le problème est qu'il essayait d'être exécuté localement et IE9 a des restrictions de sécurité contre l'utilisation de localStorage localement via le fichier: \\\
Oscar Godson
2

La question est ancienne mais j'espère que cela pourrait aider quelqu'un. Je viens de publier une version fonctionnelle de mon propre éditeur de démarques Javascript, uedit . Vous pouvez trouver le code source ici . Il fonctionne sur la plupart des navigateurs (y compris IE6 +) et ne dépend d'aucune bibliothèque JS externe.

schmrz
la source
2

Après avoir essayé avec plusieurs plugins de résoudre mes propres besoins d'offrir un seudo-WYSIWYG MarkDown, j'ai fini d'implémenter le mien:

Ce n'est peut-être pas aussi puissant que toutes les solutions commentées ici, mais je pense qu'aucune n'est aussi simple et facile à intégrer et à personnaliser .

fguillen
la source