7

çizgi şablonlarla HTML minifier kullanmak:nasıl gibi benim ön uç kodu için bazı şablonları

<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> 

Ve ben başka yapı adımda daha sonra tek bir dosyada saklayabilir ve grunt-contrib-jst kullanıyorum tek bir JS dosyasına eklenir ve bu dosya CDN'ye aktarılır. Bu bölüm gayet iyi çalışıyor, ancak Alt çizgi şablon sınırlayıcılarını içeren seçeneğini kullanmak için seçeneğini kullanmak istiyorum (<%...%>, {% ... %}, <%= ... %> yerine {{ ... }} ile değiştirildi).

html-minifier kullanmak istedim, ancak aslında hiçbir şeyi simge durumuna küçültmez, çünkü bu şablon sadece HTML olarak ayrıştırılmaya çalışılır (ve şablonlanan şablonlar nedeniyle başarısız olur).

Bu tür şablonları en aza indirmeme izin veren herhangi bir Düğüm paketi/işlevi var mı? Kaynak şablonlarda yorumlar ve boşlukları kullanmak istiyorum, ancak sonuçta oluşan yapı dosyasında gereksiz olan her şeyi yok ediyorum.

Şu anda benim JST ayarlarına bu var:

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

Ama html-minifier ile çalıştı, bu yüzden mümkün olan her şeyi en aza indirmek istiyoruz.

Teşekkürler!

+0

Hiç bir cevap buldunuz mu? JST boyutumun önemli ölçüde azaltılabileceği aynı sorunu yaşıyorum. –

+0

@JoshWLewis özür dilerim, henüz şans yok :(Görünüşe göre bu tür minimizer, Underscore etiketlerinin farkında olmalı ve bu etiketlerin dışındaki her şeyi en aza indirgemeli. –

cevap

3

Hala kendim yapmak için en iyi yolu bulmaya çalışırken alt çizgi şablonu sınırlayıcılarını en aza indirmeye yardımcı olamıyorum, ancak şablonlarınızı htmlclean aracılığıyla çalıştırmayı düşünebilirsiniz. Bunu r.js ile kullanıyorum ve koddaki yeni satırları ve boşlukları çıkarmak için gerçekten iyi çalışıyor. Örnek kullanım:

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'); 
}, 

Burada, altçizgi şablonları olan HTML'de bu sorunu kullanmayla ilgili hiçbir sorun yaşamadım. Umarım size yardımcı olur.

+0

Teşekkür ederim! –

İlgili konular