Existe alguma boa biblioteca ou controle Javascript Markdown? [fechadas]


89

Quero construir um site onde o usuário possa inserir texto e formatá-lo em Markdown. O motivo pelo qual eu gostaria de uma solução Javascript é porque desejo exibir uma visualização ao vivo, assim como no StackOverflow.

Meu site não é direcionado a desenvolvedores, portanto, um controle de editor seria o ideal.

Percebi que no StackOverflow, o editor de WMD está sendo usado.

Uma busca rápida no Google também mostra a biblioteca Showdown, que eu acho que está sendo usada por WMD.

Existem outras opções? Já são ótimas ferramentas de WMD / Showdown? Quais têm sido suas experiências com as diferentes opções?

Respostas:


33

Se você não é avesso a usar Ajax para gerar a visualização ao vivo, outra opção é markItUp! . markItUp! é um editor de marcação universal e muito flexível. Ele fornece uma maneira fácil de criar um editor de marcação, mas, ao contrário do WMD, não fornece sua própria visualização ao vivo.

Usei markItUp !, junto com um JSP simples (usando MarkdownJ ) para um dos meus projetos de código aberto (um plugin Markdown para Roller ). Se você estiver usando outra tecnologia do lado do servidor, substitua aquele JSP simples conforme apropriado.

Na verdade, comecei a usar isso antes de encontrar WMD. Eu concordo, o WMD é ótimo, mas acabou de ser liberado e é, neste estágio, mais difícil de personalizar o comportamento do.


MarkItUp! não controla alternância e seleção fixa. Este é o meu editor de texto Markdown de código aberto baseado em JavaScript. Ele suporta atalhos de teclado, diálogos personalizados, descartes personalizados e também oferece suporte a alguma seleção de texto inteligente para encorajar os usuários a escreverem sintaxe Markdown em um bom formato: github.com/tovic/markdown-text-editor
Taufik Nurrohman

65

Estamos muito felizes com as armas de destruição em massa. Existem alguns bugs mesquinhos nele, no entanto. Nada importante, mas eu adoraria se John Fraser (o autor) tornasse o código-fonte aberto para que possamos corrigir alguns deles. Ele prometeu fazer isso, mas outros projetos da vida real estão atrapalhando.

Acompanho John todas as semanas. Vou postar no blog assim que a fonte WMD estiver finalmente disponível. Não consigo entrar em contato com John Fraser há mais de um ano.

Abrimos o código da biblioteca JavaScript Markdown

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

e a biblioteca C # Markdown do lado do servidor

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


Obrigado pela resposta Jeff. Eu nem percebi que WMD não era de código aberto ... Vou manter meus olhos abertos.
webmat

2
O que você fez sobre o buraco de segurança escancarado? Por exemplo: <div onmouseover = "alert ('hi');"> hi </div> O exemplo acima funciona na demonstração do WMD!
andrewrk

1
@ superjoe30 Esse material é filtrado no servidor.
epochwolf

@ superjoe30: Veja meta.stackexchange.com/questions/95821/… - o mesmo se aplica à versão JavaScript
balpha

1
@DisgruntledGoat olhando stackexchange.github.io você pode ver que é na lista e último commit foi 6 meses atrás (2015 já).
Loïc Faure-Lacroix

12

Eu recomendaria o marcado , que é leve, eficiente, fácil de usar e também suporta GitHub Flavored Markdown (GFM). Ele pode ser usado nos lados do servidor (nodejs) ou do cliente (navegador).


O marcado ainda está sendo desenvolvido e a versão minimizada tem apenas 23 KB.
Peter T.

7

Pelo que eu sei, realmente não existe nenhum outro editor baseado em navegador para Markdown, pelo menos nenhum tão extenso quanto o editor de WMD.

Showdown é um conversor Markdown em JS, que forma a base para a visualização HTML de WMD. Ambos são feitos por http://attacklab.net/ .

E, até onde eu sei, não houve grandes reclamações sobre ambos (pelo menos não na lista de discussão Markdown). Então vá em frente.



4

Strapdown.js, que foi lançado recentemente , "torna embaraçosamente simples criar documentos Markdown elegantes. Nenhuma compilação do lado do servidor necessária."



3

A questão é ainda mais antiga agora, mas também mais relevante, visto que grande parte do código mencionado está vários anos desatualizado.

No entanto, encontrei alguns que ainda parecem atuais:

Jquery-Markedit - Este foi bifurcado do wmd-edit há algum tempo e refatorado para usar o jQuery. Parece bom à primeira vista.

EpicEditor - também é mantido, tem um analisador flexível e, como você pode ver a seguir, o autor é altamente responsivo (veja abaixo). A TI também parece ter uma boa documentação. Infelizmente, não funciona com o IE9.

MarkdownDeep é uma terceira opção que ainda está em vigor. O ponto interessante com este é o suporte para Markdown Extra. Depende de JQuery (na verdade, você também pode implementar sem JQuery). Baseado na versão .NET, então a documentação é mais alinhada a isso do que a versão JS. Isso também funciona com o IE9. É muito fácil de usar (com JQuery) e muito simples. Nenhum desenvolvimento significativo acontecendo com isso, pelo que posso ver.

js-markdown-extra é um port bastante preciso da biblioteca PHP e ainda está em manutenção. Ele suporta Markdown Extra, é claro.


1
As visualizações ao vivo funcionam bem com meu editor :) abra em tela cheia como exemplo ou simplesmente execute preview()quando a tecla for pressionada ou um tempo limite esgotado . É construído para qualquer tipo de personalização.
Oscar Godson

1
Então, sob o editor é assim que funciona agora. Depois de clicar em visualizar, ele mostra o visualizador oculto que é atualizado com o que você escreveu. Fullscreen faz isso (sorta) enquanto você digita. Para fazer seu próprio visualizador, você poderia fazer algo assim: jsbin.com/otuyub/edit#javascript,html
Oscar Godson

1
Interceptar? Você pode fazer: editor.on('save', function(file) { console.log(file.content) })se é isso que você quer dizer. Isso cuspirá o conteúdo do arquivo sempre que o arquivo for salvo.
Oscar Godson

1
Além disso, você pode querer usar em on('update')vez de salvar. Salvar irá disparar muito se o salvamento automático estiver ativado. A atualização só será disparada quando algo mudar. epiceditor.com/#events
Oscar Godson

1
Para sua informação, para quem está lendo isso: github.com/OscarGodson/EpicEditor/issues/137 - o problema é que ele estava tentando ser executado localmente e o IE9 tem restrições de segurança contra o uso localStorage localmente via arquivo: \\\
Oscar Godson

2

A pergunta é antiga, mas espero que isso possa ajudar alguém. Eu publiquei recentemente uma versão funcional do meu próprio editor de markdown de Javascript, o uedit . Você pode encontrar o código-fonte aqui . Funciona na maioria dos navegadores (incluindo IE6 +) e não depende de nenhuma biblioteca JS externa.


2

Depois de tentar com vários plugins resolver minhas próprias necessidades de oferecer um MarkDown seudo-WYSIWYG terminei de implementar o meu próprio:

Talvez não seja tão potente quanto todas as soluções comentadas aqui, mas acho que nenhuma é tão simples e fácil de integrar e personalizar .

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.