มีไลบรารี 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 ฉันเห็นด้วย WMD นั้นยอดเยี่ยม แต่เพิ่งเป็นแบบโอเพนซอร์สและในขั้นตอนนี้การปรับแต่งพฤติกรรมของ.


MarkItUp! ไม่จัดการการสลับและการเลือกแบบติดหนึบ นี่คือโปรแกรมแก้ไขข้อความMarkdownแบบโอเพนซอร์สของฉันที่ใช้ JavaScript รองรับแป้นพิมพ์ลัดกล่องโต้ตอบที่กำหนดเองหยดที่กำหนดเองและยังรองรับการเลือกข้อความอัจฉริยะบางอย่างเพื่อสนับสนุนให้ผู้ใช้เขียนไวยากรณ์Markdownในรูปแบบที่ดี: github.com/tovic/markdown-text-editor
Taufik Nurrohman

65

เราค่อนข้างพอใจกับ WMD อย่างไรก็ตามมีข้อบกพร่องเล็กน้อยอยู่ในนั้น ไม่มีอะไรสำคัญ แต่ฉันจะชอบถ้า John Fraser (ผู้เขียน) สร้างโค้ดโอเพ่นซอร์สเพื่อให้เราสามารถแก้ไขบางส่วนได้ เขาสัญญาว่าจะทำเช่นนั้น แต่โครงการอื่น ๆ ในชีวิตจริงกำลังเข้ามาขวางทาง

ฉันติดตามจอห์นทุกสัปดาห์ ฉันจะโพสต์ในบล็อกเมื่อแหล่งข้อมูล WMD พร้อมใช้งานในที่สุด ยังไม่สามารถติดต่อ John Fraser ได้ภายในเวลากว่าหนึ่งปีแล้ว

เราได้เปิดแหล่งที่มาทั้งไลบรารี JavaScript Markdown

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

และไลบรารี C # Markdown ฝั่งเซิร์ฟเวอร์

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


ขอบคุณสำหรับคำตอบ Jeff ฉันไม่รู้ด้วยซ้ำว่า WMD ไม่ใช่โอเพ่นซอร์ส ... ฉันจะกลอกตา
webmat

2
คุณทำอะไรเกี่ยวกับช่องโหว่ด้านความปลอดภัยที่อ้าปากค้าง ตัวอย่างเช่น <div onmouseover = "alert ('hi');"> hi </div> ข้างต้นใช้งานได้ในการสาธิต WMD!
andrewrk

1
@ superjoe30 สิ่งนั้นถูกกรองบนเซิร์ฟเวอร์
epochwolf

@ superjoe30: ดูmeta.stackexchange.com/questions/95821/… - เช่นเดียวกับเวอร์ชัน JavaScript
balpha

1
@DisgruntledGoatดูที่stackexchange.github.ioคุณจะเห็นว่ามันอยู่ในรายการและการกระทำล่าสุดคือ 6 เดือนที่แล้ว (2015 แล้ว)
Loïc Faure-Lacroix

12

ฉันขอแนะนำให้ทำเครื่องหมายซึ่งมีน้ำหนักเบามีประสิทธิภาพใช้งานง่ายและรองรับ GitHub Flavored Markdown (GFM) ด้วย สามารถใช้ได้ทั้งในเซิร์ฟเวอร์ (nodejs) หรือฝั่งไคลเอ็นต์ (เบราว์เซอร์)


การทำเครื่องหมายยังอยู่ในระหว่างการพัฒนาและเวอร์ชันย่อมีขนาดใหญ่เพียง 23 KB
Peter T.

7

เท่าที่ฉันรู้ไม่มีตัวแก้ไขบนเบราว์เซอร์อื่น ๆ สำหรับ Markdown อย่างน้อยก็ไม่มีอะไรที่ครอบคลุมเท่าตัวแก้ไข WMD

Showdown เป็นตัวแปลง Markdown ใน JS ซึ่งเป็นพื้นฐานสำหรับการแสดงตัวอย่าง HTML ของ WMD พวกเขาทั้งสองทำโดยhttp://attacklab.net/

และเท่าที่ฉันรู้ว่าไม่มีการร้องเรียนใด ๆ เกี่ยวกับทั้งสองอย่าง (อย่างน้อยก็ไม่อยู่ในรายชื่อผู้รับจดหมาย 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
ดังนั้นภายใต้ตัวแก้ไขคือวิธีการทำงานตอนนี้ เมื่อคุณคลิกดูตัวอย่างจะแสดงตัวแสดงตัวอย่างที่ซ่อนอยู่ซึ่งอัปเดตตามสิ่งที่คุณเขียน เต็มหน้าจอ (sorta) ในขณะที่คุณพิมพ์ หากต้องการสร้างตัวอย่างของคุณเองคุณสามารถทำสิ่งนี้: 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
FYI สำหรับทุกคนที่อ่านสิ่งนี้: github.com/OscarGodson/EpicEditor/issues/137 - ปัญหาคือมันพยายามเรียกใช้ในเครื่องและ IE9 มีข้อ จำกัด ด้านความปลอดภัยไม่ให้ใช้ localStorage ในเครื่องผ่านไฟล์: \\\
Oscar Godson

2

คำถามนี้โบราณ แต่หวังว่าจะช่วยใครบางคนได้ ฉันได้รับการตีพิมพ์เมื่อเร็ว ๆ นี้เป็นรุ่นที่ทำงานของตัวเอง Javascript markdown บรรณาธิการของฉันuedit คุณสามารถค้นหารหัสที่มาที่นี่ ใช้งานได้กับเบราว์เซอร์ส่วนใหญ่ (รวมถึง IE6 +) และไม่ขึ้นอยู่กับไลบรารี JS ภายนอกใด ๆ


2

หลังจากลองใช้ปลั๊กอินหลายตัวเพื่อแก้ปัญหาความต้องการของตัวเองในการเสนอ MarkDown seudo-WYSIWYG ฉันได้ยุติการใช้งานปลั๊กอินของตัวเอง:

อาจจะไม่เป็นที่มีประสิทธิภาพเช่นการแก้ปัญหาทั้งหมดให้ความเห็นที่นี่ แต่ฉันคิดว่าไม่มีใครที่เป็นที่เรียบง่ายและง่ายต่อการรวมและการปรับแต่ง

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.