ट्विटर बूटस्ट्रैप कम से कम काम नहीं कर रहा है .js

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

बूटस्ट्रैप 1.4.0 कम 1.1.3

<html> 
    <head> 
     <title>ahhhhhh...</title> 

     <link rel="stylesheet/less" href="/less/bootstrap/1.4.0/bootstrap.less"> 
     <script src="/less/less-1.1.3.min.js"></script> 

    </head> 
    <body> 

     <h1>WTF!!!</h1> 

    </body> 
</html>

मैं एक साधारण style.less जो ठीक काम करता है बनाया! क्या मैं कुछ चमकदार रूप से स्पष्ट हूं?

अद्यतन: के रूप में टोड द्वारा अनुरोध

style.less:

@primary_color: green; 

h1 { 
    color: @primary_color; 
}

स्रोत

2011-11-11 briangallagher

आप पोस्ट कर सकते हैं अपने style.less? – Todd

@Todd ने पोस्ट को अपडेट किया। शैली। हालांकि ठीक काम करता है। – briangallagher

क्या यह कंसोल के भीतर लोड/रेंडर स्टाइलशीट दिखाता है? –

आप इस स्थानीय रूप से विकसित कर रहे हैं तो सुनिश्चित करें कि ब्राउज़र सही प्रोटोकॉल का उपयोग किया गया है। इसे पता बार में http: प्रदर्शित करना चाहिए, फ़ाइल नहीं:।

मेरी विंडोज 7 मशीन क्रोम का उपयोग (एक XAMPP सेटअप के साथ), मैं बूटस्ट्रैप साथ less.js का उपयोग करते समय पर .html फ़ाइल तक पहुँचने में एक ही सीएसएस समस्या हो रही थी पर:

file:///C:/xampp/htdocs/index.html

हालांकि, यह किया पर http के माध्यम से ठीक से प्रस्तुत:

http://localhost/index.html

कुछ नहीं क्यों, लेकिन मुझे लगता है कि less.js HTTP हेडर पर निर्भर करता है।

स्रोत

2011-11-15 02:49:39 joelhaus

क्या यह आपकी फ़ाइल संरचना में समस्या है? /less/bootstrap/1.4.0/bootstrap.less आपकी एचटीएमएल फाइल के बावजूद आपके डोमेन की जड़ को इंगित करेगा।

आप अपाचे के साथ होस्ट कर रहे हैं और आपको निम्न परियोजना संरचना है, तो: क्या आप http://localhost से index.html का उपयोग करते हैं

www/ 
    your project/ 
     less/ 
     index.html 
    another project/ 
    others/

, यह डोमेन जड़ जो www/ है से less फ़ाइल दिखेगा । इस प्रकार less फ़ोल्डर इस रूट निर्देशिका के अंतर्गत है, यह 404 (नहीं मिला) के रूप में वापस आ जाएगा।

तो, समाधान आपकी कम फ़ाइलों के लिए सापेक्ष यूआरएल का उपयोग करना है। यदि आपके ऊपर उपरोक्त संरचना है, तो '/' को हटाएं और इसके बजाय less/bootstrap/1.4.0/bootstrap.less का उपयोग करें।

स्रोत

2011-11-15 03:44:57 steveyang

दुर्भाग्यवश यह समस्या नहीं है। ऐप वर्चुअल होस्ट पर है और सभी सीएसएस/कम डोमिनियन की जड़ से संबंधित हैं। सभी फाइलें सही तरीके से हल हो रही हैं, यहां तक कि इस सीमा तक कि आयात कम फ़ाइलें लोड हो रही थीं। – briangallagher

अपडेट 3/5/2012: बूटस्ट्रैप लोगों ने बूटस्ट्रैप के संस्करण 2.0.2 में अभी तक इस समस्या को ठीक नहीं किया है (अभी तक जारी नहीं किया गया है)। this commit देखें।

अंतर्निहित बग कि less.js के वर्तमान संस्करण आप यूआरएल के लिए के लिए एक चर का उपयोग करने के लिए) सीधे अनुमति नहीं है (मूल्य है (उदाहरण के url(@iconWhiteSpritePath)) - इसके बजाय आप स्ट्रिंग प्रक्षेप का उपयोग करना होगा (जैसे url("@{iconWhiteSpritePath}")) , जो एक ही चीज़ को पूरा करता है। बूटस्ट्रैप लड़कों ने इस quirk को खाते में लेने के लिए बस अपने वाक्यविन्यास को अद्यतन किया।

मूल उत्तर

मैं आज सटीक समस्या में पड़ गए और इसका कारण पता लगा।चूंकि आपका ढेर मेरे सामने कुछ संस्करण है (मैं बूटस्ट्रैप 2.0 और less.js 1.2.2 का उपयोग कर रहा हूं) मुझे यकीन नहीं है कि यह एक ही मुद्दा है, लेकिन यह संभवतः संबंधित है।

@iconSpritePath:   "../img/glyphicons-halflings.png"; 
@iconWhiteSpritePath:  "../img/glyphicons-halflings-white.png";

और फिर sprites.less में एक पृष्ठभूमि छवि के लिए यूआरएल() मान में उन्हें सीधे का उपयोग कर:

किसी भी तरह, मेरे लिए समस्या यह है कि ट्विटर बूटस्ट्रैप कुछ चर को परिभाषित किया गया है था

[class^="icon-"], 
[class*=" icon-"] { 
    display: inline-block; 
    width: 14px; 
    height: 14px; 
    line-height: 14px; 
    vertical-align: text-top; 
    background-image: url(@iconSpritePath); 
    background-position: 14px 14px; 
    background-repeat: no-repeat; 

    .ie7-restore-right-whitespace(); 
} 
.icon-white { 
    background-image: url(@iconWhiteSpritePath);

}

this Github issue में चर्चा के अनुसार

कि एक बड़ी समस्या पैदा कर रहा है। जब कम मूल्य .js इस मान पर चोक करता है, तो संपूर्ण संकलन विफल रहता है।

अच्छी खबर यह है कि सीएसओवर द्वारा प्रदान की गई समस्या में एक फिक्स है। बस tree.URL में इस लाइन बदलने के लिए:

if (typeof(window) !== 'undefined' && !/^(?:https?:\/\/|file:\/\/|data:|\/)/.test(val.value) && paths.length > 0) {

if (typeof(window) !== 'undefined' && typeof(val.value) !== 'undefined' && !/^(?:https?:\/\/|file:\/\/|data:|\/)/.test(val.value) && paths.length > 0) {

करने के लिए और आप सेट किया जाना चाहिए। दूसरे शब्दों में, हम केवल यह सुनिश्चित करते हैं कि val.value सेट किया गया है ताकि charAt() एक अपरिभाषित पर चकित न हो।

उम्मीद है कि यह फ़िक्स जल्द ही प्रोजेक्ट के लिए प्रतिबद्ध होगा और बूटस्ट्रैप बॉक्स के बाहर ब्राउज़र वातावरण में less.js के साथ काम करेगा।

स्रोत

2012-02-17 19:38:43 jsdalton

यह मेरे लिए काम करता है, लेकिन ध्यान दें कि यह केवल less.js के पूर्ण संस्करण के लिए काम करता है (यहां उपलब्ध है: https://github.com/cloudhead/less.js), न कि संस्करण जो आप अपनी वेबसाइट से डाउनलोड करते हैं। – feldoh

मेरे लिए

[class^="icon-"], 
[class*=" icon-"] { 
    display: inline-block; 
    width: 14px; 
    height: 14px; 
    line-height: 14px; 
    vertical-align: text-top; 
    background-image: url(../img/glyphicons-halflings.png); 
    background-position: 14px 14px; 
    background-repeat: no-repeat; 

    .ie7-restore-right-whitespace(); 
} 
.icon-white { 
    background-image: url(../img/glyphicons-halflings-white.png); 
}

काम किया तो

url(../img/glyphicons-halflings.png);

less.js v1.2.1 और बूटस्ट्रैप v2.0.1 पर

साथ

url(@iconSpritePath);

की जगह

स्रोत

2012-02-23 00:40:26 maxx

मैं एक ही मुद्दे में भाग गया। आपका समाधान मेरे लिए काम करता है। धन्यवाद! – Abe

@ अब सावधान रहें, यह इस तरह से काम नहीं करता है - नए समाधान का उपयोग करें – maxx

ट्विटर बूटस्ट्रैप कम से कम काम नहीं कर रहा है .js

उत्तर

संबंधित मुद्दे