7

Ich habe einige Vorlagen für meinen Frontend-Code verwenden, wie:Wie einen HTML-minifier mit Strich Vorlagen

<div class="row"> 
    <div class="my-header col-md-1"> 
     <!-- comments --> 
     {{ title }} 
    </div> 
    <div class="my-container col-md-11"> 
    {% if (content) { %} 
     {{ content }} 
    {% } else { %} 
     <p>Empty</p> 
    {% } %} 
    </div> 
</div> 

Und ich bin mit grunt-contrib-jst sie alle in einer einzigen Datei zu speichern und dann auf einem anderen Build-Schritt wird in einer einzelnen JS-Datei enthalten sein und diese Datei wird an das CDN übergeben. Dieser Teil funktioniert einwandfrei, aber ich möchte die Option verwenden, um den HTML-Vorlagencode zu minimieren, der Undercore-Vorlagenbegrenzer enthält (<%...%> ersetzt durch {% ... %}, <%= ... %> ersetzt durch {{ ... }}).

Ich wollte html-minifier verwenden, aber es minimiert tatsächlich nichts, anscheinend weil es versucht, die Vorlage als HTML-only zu analysieren (und aufgrund der Templating-Tags fehlschlägt).

Gibt es ein Node-Paket/Funktion, die es mir erlaubt, diese Art von Vorlagen zu minimieren? Ich würde gerne Kommentare und Leerzeichen in Source Templates verwenden, aber alles unnötige auf der resultierenden Build-Datei entfernen.

Im Moment habe ich diese auf meiner JST Einstellung:

processContent: function (content) { 
    return content 
     .replace(/^[\x20\t]+/mg, '') 
     .replace(/[\x20\t]+$/mg, '') 
     .replace(/^[\r\n]+/, '') 
     .replace(/[\r\n]*$/, '\n'); 
}, 
... 

Aber ich will alles möglich zu minimieren, das ist, warum ich mit html-minifier versucht.

Danke!

+0

Haben Sie jemals eine Antwort gefunden? Ich habe das gleiche Problem, wo meine JST-Größe erheblich reduziert werden konnte. –

+0

@JoshWLewis Sorry, bisher kein Glück :(Offensichtlich muss diese Art von Minimizer die Underscore-Tags kennen und alles außerhalb dieser Tags minimieren. –

Antwort

3

Ich kann nicht wirklich helfen mit der Minimierung der Unterstrich-Trennzeichen, immer noch versuchen, die beste Möglichkeit, das zu tun, selbst, aber Sie könnten in Betracht ziehen, Ihre Vorlagen über htmlclean laufen zu lassen. Ich benutze es mit r.js und es funktioniert wirklich gut zum Entfernen von Zeilenumbrüchen und Leerzeichen im Code. Beispiel Nutzung:

var htmlclean = require('htmlclean'); 

// ... 
processContent: function (content) { 
    return htmlclean(content) 
     .replace(/^[\x20\t]+/mg, '') 
     .replace(/[\x20\t]+$/mg, '') 
     .replace(/^[\r\n]+/, '') 
     .replace(/[\r\n]*$/, '\n'); 
}, 

Ich habe mit der Verwendung dieses auf HTML keine Probleme hat, die Vorlagen in dort unterstrichen hat. Ich hoffe es hilft dir.

+0

Danke! Ich werde es versuchen :) –