Sinatra projesinde Twitter Bootstrap ve Sass kullanmaya nasıl başlayabilirsiniz?

Question

Twitter Bootstrap'in daha az yazıldığını biliyorum, ancak bir grup Sass sürümü de var. Sinatra projemi nasıl kullanacağımı ve nasıl kullanacağımı anladığım için çok zorlanıyorum.

Öğelerimin bir üretim ortamında önceden derlenmesini ve parmak izinin alınmasını istiyorum, ancak geliştirme sırasında sıkıştırılmamış varlıkları var, böylece daha kolay hata ayıklama yapabilirim (Rails varlık borusu gibi). bootstrap-sass'u kurmayı denedim, ancak Compass gerektiriyor. Ama tüm twitter bootstrap karışımlarına sahip olduğumda pusulasına ihtiyacım yok. Bunu yapılandırırken de sorun yaşadım. Her neyse, ne yapmam gerektiği konusunda kesin bir cevap yardımcı olacaktır. Sadece bana on-the-fly versiyonunu gösterir

<% if settings.development? %> 
    <link rel="stylesheet/less" href="/less/style.less"> 
    <%= javascript_tag "/js/libs/less-1.2.1.min.js" %> 
<% end %> 

<% if settings.production? %> 
    <%= stylesheet_tag "/css/mycss.css" %> 
<% end %> 

Bu şekilde:

Answer 1

Sadece bootstrap .less sürümü, ya da benim recompiled .css versiyonu için benim düzeni şablonunda env bağımlı etiketleri kullanmak geliştirme modunda ve üretim modunda .css dosyası. Dağıtdığımda, komut satırındaki stil sayfalarını derlerim.

@import "bootstrap/bootstrap.less"; 

@import "bootstrap/responsive.less"; 

:

$ lessc public/less/style.less > public/css/mycss.css 

(. Ben de üretim için css dosyası zaman damgası uygulamak için https://github.com/wbzyl/sinatra-static-assets/ kullanıyorum o örnekte)

kamu/az/style.less gibi sadece bir şey başlar Ve tüm bootstrap .less dosyaları public/less/bootstrap/

'da yaşıyor. Temel olarak https://github.com/twitter/bootstrap/tree/master/less'un tamamını buraya bırakın. Gerçekten küstahlığı kullanmak zorundaysanız (

|:()

Ve daha sonra gerçek çekirdek önyükleme dosyaları Yaptığınız diğer dosyalarını içe veya düzenlerken, aynı dosyada aşırı sürme şeyleri kendiniz başlatabilirsiniz Bunun neden böyle olduğunu görmüyorum, yoruma bakın), düzeninize kolayca eklenebilecek standart bir .js derleyicisi olmadığı kadar basit değil.

Geliştirme modunda çalışırken config.ru'nızda http://sass-lang.com/docs/yardoc/Sass/Plugin/Rack.html kullanmak için rafa bildirmeyi deneyebilirsiniz. Bunu hiç denemedim ve kullanmaya çalıştığımda bir keresinde rafsız eklenti ile sorun yaşadım.