सिनात्रा ऐप में एक सैस फ़ाइल को कैसे लिंक करें?

Question

मैं एक सैसा फ़ाइल को सिनात्रा ऐप से जोड़ने का प्रयास कर रहा हूं। मेरे पास public/sass/styles.scss फ़ाइल है और मैं इसे अपने views/layout.haml फ़ाइल में लिंक करने का प्रयास कर रहा हूं। मैं अपने layout.haml: %link(rel="stylesheet" href="styles.css") में निम्न लिंक का उपयोग कर एक नियमित सीएसएस फ़ाइल को जोड़ने में सक्षम हूं। हालांकि, जब मैं अपने sass/styles.scss से कोशिश करता हूं और लिंक करता हूं, तो यह काम नहीं करता है। क्या कोई मुझे बता सकता है कि सिनात्रा ऐप में एक एसएएस सीएसएस फ़ाइल को कैसे लिंक करें? धन्यवाद!

Answer 1

आप एसएसएस को लिंक नहीं करते हैं, एक एसएएस की तरह एक एसएसएस एक फ़ाइल नहीं है जिसे ब्राउज़र द्वारा व्याख्या किया जाना चाहिए, आपको एक कंपाइलर की आवश्यकता है जो इस फ़ाइल को संसाधित करे और इसे सीएसएस में परिवर्तित करें।

आप कम्पास मणि की जरूरत है अपने आप आपके एससीएसएस से सीएसएस उत्पन्न करने के लिए और फिर आप सीएसएस लिंक के रूप में आप बात कर रहे थे

से पहले

यहाँ आप सिनात्रा के लिए कम्पास विन्यास का एक उदाहरण है:

https://github.com/chriseppstein/compass/wiki/Sinatra-Integration

Answer 2

आपको अपनी .scss फ़ाइलों को संकलित करने के लिए एक अलग मणि का उपयोग करने की आवश्यकता नहीं है, Sass में अंतर्निहित है।

sass --watch style.scss:style.css स्टास.sssss को style.css में स्वचालित रूप से संकलित करने के लिए सेट करेगा जब भी यह बदलेगा। Sass website से,

अब जब भी आप style.scss बदलने के लिए, सास स्वचालित रूप से परिवर्तन के साथ style.css अद्यतन करेगा। आप कई सास फ़ाइलें जब पर बाद में, आप भी एक पूरी निर्देशिका

Answer 3

देख सकते हैं आप कर सकता है:

get '/stylesheets/*.css' do 
    content_type 'text/css', :charset => 'utf-8' 
    filename = params[:splat].first 
    sass filename.to_sym, :views => "#{settings.root}/assets/stylesheets" 
end 

Answer 4

आप उपयोग कर सकते हैं Sass::Plugin::Rack

पहले सास मणि स्थापित करें।

यदि आप बंडलर का उपयोग कर रहे हैं, तो इसे अपने Gemfile में जोड़ें: gem 'sass'।

अपने config.ru ऐड में:

require 'sass/plugin/rack' 

Sass::Plugin.options[:style] = :compressed 
use Sass::Plugin::Rack 

फिर public/stylesheets/sass/ में एक फ़ोल्डर बनाने, और अपने सभी .scss और वहाँ .sass फ़ाइलें ड्रॉप।

यह public/stylesheets/

उदाहरण के लिए में इसी .css पैदा करेगा: public/stylesheets/sass/style.scsspublic/stylesheets/style.css

उत्पन्न होगा और बस हो गया, आप डिफ़ॉल्ट लोगों से रास्तों को बदल सकते हैं और अन्य विकल्पों reference docs

में उल्लेख बदल