Domanda

Attualmente sto usando Jade su un nuovo progetto. Sembra molto adatto alla composizione layout webapp, ma non per la scrittura contenuto statico, ad esempio una pagina web di

elementi contenenti testo.

Ad esempio, per creare un tale punto, credo che ho bisogno di fare questo:

p
  | This is my long,
  | multi-line
  | paragraph.

Per una pagina web statica pieno di punti reali di testo, utilizzando giada diventa un peso a causa di quel simbolo pipe all'inizio di ogni riga.

C'è una sorta di zucchero sintattico per marcare l'intero blocco come un nodo di testo, come il simbolo pipe fa con il metodo dell'integrazione globale? O un filtro esistente Sono a conoscenza di?

Una soluzione che sto esplorando è la creazione di un: filtro di blocco o qualcosa, che antepone ogni riga con un | e poi lo passa a Jade, ma la documentazione di Jade sulla creazione di filtri è scarsa a dir poco, in modo che possa prendere un po 'per capire. Se chiunque può fornire una guida per tale soluzione un sarei grato.

È stato utile?

Soluzione

giada github pagina :

p.
foo asdf
asdf
 asdfasdfaf
 asdf
asd.

produce un output:

<p>foo asdf
asdf
  asdfasdfaf
  asdf
asd
.
</p>

Il periodo finale dopo il p è quello che stai cercando.

Altri suggerimenti

Dopo alcuni ritocchi, ho lavorato fuori i dettagli di un filtro che realizza questo. Pubblicando la risposta qui poiché immagino che questo sarà utile ad altri che utilizzano giada.

Il codice per creare il filtro risulta essere molto semplice:

var jade = require ("jade");

jade.filters.text = function(block, compiler){
    return new TextBlockFilter(block).compile();
};

function TextBlockFilter(node) {
    this.node = node;
}

TextBlockFilter.prototype.__proto__ = jade.Compiler.prototype;

TextBlockFilter.prototype.visit = function(node){

    // first this is called with a node containing all the block's lines
    // as sub-nodes, with their first word interpreted as the node's name
    //
    // so here, collect all the nodes' text (including its name)
    // into a single Text node, and then visit that instead.
    // the child nodes won't be visited - we're cutting them out of the
    // parse tree

    var text = new jade.nodes.Text();
    for (var i=0; i < node.length; i++) {
        text.push (node[i].name + (node[i].text ? node[i].text[0] : ""));
    }
    this.visitNode (text);
};

E poi gli sguardi di markup come questo. Nota che consente di includere altre cose giada tra: blocchi di testo:

p
  :text
    This is my first line of text,
    followed by another
    and another.  Now let's include a jade link tag:
  a(href="http://blahblah.com")
  :text
    and follow it with even more text 
    and more,
    etc
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top