2014-10-22 28 views
8

Marked ile Uygulama sırasında lexer kurallarını kolayca değiştirebilir/ekleyebilir/değiştirebilir ve harika! Örneğin böyle bir başlık yapmak için bir metin giriş karma arasındaki boşluğu kullanmak zorlayabilirsiniz:, işaretli.js için özel InlineLexer kuralı nasıl yazılır?

var lexer = new marked.Lexer(options); 
console.log(lexer); 
lexer.rules.heading = /^\s*(#{1,6})\s+([^\n]+?) *#* *(?:\n+|$)/ 

console.log(marked.parser(lexer.lex('#hashtag?'), options)); 
//<p>#hashtag?</p> 
console.log(marked.parser(lexer.lex('# heading?'), options)); 
//<h1 id="undefinedheading-">heading?</h1> 

Serin!

inlineLexer için kolayca aynı şekilde yapmanın bir yolu var mı? İnsanların bir sonraki diziyle görüntü ekleyebilmeleri gibi: %[My Image](http://example.com/img.jpg)? Yani ben modifiye:

var inlineLexer = marked.InlineLexer; 
inlineLexer.rules.link = /^[!%]{0,1}?\[((?:\[[^\]]*\]|[^\[\]]|\](?=[^\[]*\]))*)\]\(\s*<?([\s\S]*?)>?(?:\s+['"]([\s\S]*?)['"])?\s*\)/; 
... 

Bundan sonra ne yapmalıyım? Özel bir inlineLexer işaretli bir örneğe nasıl bağlanır? Lütfen bunu nasıl yapacağınıza dair bir örnek göster! Özel satır içi lexer kurallarını nasıl değiştirebilirim/ekleyebilirim?

+1

Lütfen çözümüme gönderdiğim bu [sayı] (https://github.com/chjj/marked/issues/504) adresine bakın. – Rugal

cevap

4

Kütüphane kaynağını değiştirmeden veya genel olarak işaretlenmiş örneği veya prototipleri etkilemeden satır içi lexer'ın bazı özelleştirme işlemlerine izin vermek için, işaretli bir konum parçasının yolunu bulmak üzere işaretli.js için kaynak koduna baktım.

var renderer = new marked.Renderer(); 
var lexer = new marked.Lexer(); 
var parser = new marked.Parser(); 

var options = { 
    renderer: renderer, 
    gfm: true, 
    tables: false, 
    breaks: true, 
    pedantic: false, 
    sanitize: true, 
    smartLists: true, 
    smartypants: false 
} 

parser.inline = new marked.InlineLexer([], options); 
parser.inline.rules = angular.copy(parser.inline.rules); // deep copy, otherwise global marked will be affected 

parser.inline.rules.link = /^[!%]{0,1}?\[((?:\[[^\]]*\]|[^\[\]]|\](?=[^\[]*\]))*)\]\(\s*<?([\s\S]*?)>?(?:\s+['"]([\s\S]*?)['"])?\s*\)/; 
renderer.link = function(href, title, text) { 
    // this is the standard link renderer that can be altered if desired ... 
    if (this.options.sanitize) { 
     try { 
      var prot = decodeURIComponent(unescape(href)) 
       .replace(/[^\w:]/g, '') 
       .toLowerCase(); 
     } catch (e) { 
      return ''; 
     } 
     if (prot.indexOf('javascript:') === 0 || prot.indexOf('vbscript:') === 0) { 
      return ''; 
     } 
    } 
    var out = '<a href="' + href + '"'; 
    if (title) { 
     out += ' title="' + title + '"'; 
    } 
    out += '>' + text + '</a>'; 
    return out; 
} 

function parse(src) { 
    parser.inline.links = src.links; 
    parser.tokens = src.reverse(); 
    var out = ''; 
    while (parser.next()) { 
     out += parser.tok(); 
    } 
    return out; 
}; 

function parseText(text) { 
    var lex = lexer.lex(text); 
    var r = parse(lex); 
    return r; 
} 
+0

Angular.copy(), inline lexer kurallarının sadece kısa bir kopyasını yapmak için kullanıyorum ve angularjs kullandığım için, ancak herhangi bir derin kopya iyi olacak. –

+1

Harika. Denemeliyim. Ama asırlar önceydi. :) –