सिनात्रा परियोजना में ट्विटर बूटस्ट्रैप और सास का उपयोग कैसे शुरू करें?

Question

मुझे पता है कि ट्विटर बूटस्ट्रैप कम में लिखा गया है, लेकिन सैस संस्करणों का एक गुच्छा भी है। मुझे उपयोग करने के लिए सबसे अच्छा समय और मेरा सिनात्रा परियोजना कैसे स्थापित करना मुश्किल समय लगता है।

मैं चाहता हूं कि मेरी संपत्तियां पहले से संकलित हों और उत्पादन वातावरण में फिंगरप्रिंट हो जाएं लेकिन विकास में असम्पीडित संपत्तियां हों ताकि मैं आसान डीबग कर सकूं (रेल की संपत्ति पाइपलाइन की तरह)। मैंने bootstrap-sass स्थापित करने का प्रयास किया, लेकिन इसे कम्पास की आवश्यकता है। लेकिन जब मुझे सभी ट्विटर बूटस्ट्रैप मिश्रण मिलते हैं तो मुझे वास्तव में कंपास की आवश्यकता नहीं होती है। मुझे इसे कॉन्फ़िगर करने में भी परेशानी थी।

वैसे भी, मुझे जो करना चाहिए, उसके बारे में एक निश्चित उत्तर सहायक होगा।

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

इस तरह यह सिर्फ मुझे ऑन-द-मक्खी संस्करण दिखाता है:

Answer 1

मैं सिर्फ env पर निर्भर टैग मेरी लेआउट टेम्पलेट में बूटस्ट्रैप के .less संस्करण, या मेरे कंपाइल .css संस्करण के लिए उपयोग विकास में, और उत्पादन मोड में .css फ़ाइल। जब मैं तैनात करता हूं तो मैं कमांड लाइन पर स्टाइलशीट संकलित करता हूं।

@import "bootstrap/bootstrap.less"; 

@import "bootstrap/responsive.less"; 

:

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

(। कि उदाहरण मैं भी https://github.com/wbzyl/sinatra-static-assets/ उपयोग कर रहा हूँ उत्पादन के लिए सीएसएस फ़ाइल टाइमस्टैम्प के में)

सार्वजनिक/कम/style.less बंद बस की तरह कुछ शुरू होता है और सभी बूटस्ट्रैप .less फ़ाइलें सार्वजनिक/कम/बूटस्ट्रैप/

मूल रूप से बस https://github.com/twitter/bootstrap/tree/master/less पर सभी ड्रॉप करें।

और तुम तो अधिक सवारी बातें अपने आप को एक ही फाइल में शुरू कर सकते हैं, वास्तविक कोर बूटस्ट्रैप फ़ाइलें अन्य फ़ाइलें आयात आपके द्वारा किए गए, या संपादन (: |)

तुम सच में सास का उपयोग करने के है (मुझे नहीं लगता कि यह मामला क्यों होना चाहिए, टिप्पणी देखें) यह उतना आसान नहीं है जितना मानक नहीं है क्योंकि आपके लेआउट में आसानी से शामिल करने के लिए मानक। जेएस कंपाइलर नहीं है।

मुझे लगता है कि जब आप विकास मोड में चल रहे हों तो आप अपने config.ru में http://sass-lang.com/docs/yardoc/Sass/Plugin/Rack.html का उपयोग करने के लिए रैक को बताने का प्रयास कर सकते हैं। मैंने कभी कोशिश नहीं की है, और जब भी मैंने इसका इस्तेमाल करने की कोशिश की तो मुझे बिना किसी रैक प्लगइन में परेशानी थी।