वहाँ सीएसएस के लिए लेस फ़ाइलों को संकलित करने का एक तरीका है (ताकि हर ब्राउज़र को न हो)?

20

मैं LESS का उपयोग करने पर विचार कर रहा हूं, लेकिन मैं उस ब्राउज़र के बारे में सोच रहा हूं, जिसमें जावास्क्रिप्ट अक्षम है और मेरा CSS पठनीय नहीं है (और जो साइट भयानक दिख रही है)।

इसके अलावा, यह मेरे लिए इंजीनियर को हर उस ब्राउज़र को "संकलन" करने के लिए मजबूर करता है जो कम फ़ाइल को .css देता है, जब हम इसे हर बार एक बार "संकलित" कर सकते हैं जब हम इसे संशोधित करते हैं।

css css-framework

— क्ले निकोल्स
स्रोत

1

@ बेनामी- अगर आप LESS की जाँच करते हैं, तो आपको SASS और COMPASS पर भी नज़र डालनी चाहिए।

— सोरसी

स्टाइलस और OOCSS भी इसी तरह के उत्पाद हैं।

— लेजे मेजेस्टे

1

मैंने एक संबंधित उत्तर दिया है जिसमें बताया गया है कि सर्वर पर स्वचालित रूप से LESS संकलन कैसे सेट किया जाए: webmasters.stackexchange.com/questions/38386/…

— romaninsh

3

मुझे नहीं पता था कि कोई भी ब्राउज़रों में कम संकलन कर रहा था!

— केनी एविट

17

हाँ। आप एक कोड का उपयोग कर सकते हैं जो कोड के रूप में आपके विकास मशीन पर सीएसएस को ऑटो फाइलों को ऑटो-संकलित करता है। फिर जब आप डेवलपिंग कर रहे हों तो केवल जेनरेट सीएसएस फाइल को अपने सर्वर पर अपलोड करें।

की कमी! विंडोज और मैक के लिए
विंडोज के लिए WinLess
मैक के लिए कोडकिट

— छेद
स्रोत

11

मैं SimpLESS का उपयोग करता हूं - ड्रैग, ड्रॉप, किया।

— Sorcy
स्रोत

10

LESS एक द्विआधारी (एसईसी) के साथ आता है जो आपको अपनी .less फ़ाइलों को प्री-कंपाइल करने की सुविधा देता है। आप इसे इस प्रकार उपयोग करते हैं:

 $ lessc styles.less > styles.css

लेकिन मुझे लगता है कि जब भी LESS फाइल अपडेट होती है तो ज्यादातर लोग सीएसएस स्टाइलशीट को स्वचालित रूप से पुन: व्यवस्थित करने के लिए lessc -wया lessc --watchकमांड का उपयोग करते हैं । आप सीएसएस को छोटा भी कर सकते हैं, जैसे lessc -w -x।

संपादित करें: बस स्पष्ट करने के लिए, एसआरसी सर्वर-साइड इंस्टॉल के साथ आता है (यानी जब आप नोड के माध्यम से कम स्थापित करते हैं। पैकेज प्रबंधक)। लेकिन आप इसे मैन्युअल रूप से GitHub से डाउनलोड कर सकते हैं ।

lessc पर स्थित है /bin/lessc। यह (मैक लिए काम करना चाहिए भी) बेशक एक * nix द्विआधारी की है, लेकिन है एक Windows बाइनरी ( lessc.exe ) dotless के आधार पर है, जो किसी अन्य Windows कम संकलक है।

अद्यतन:less-watch स्वचालित रूप से संकलन करने के लिए उपयोग करें ।

वैकल्पिक रूप से, इन दिनों कई डेवलपर्स कार्य धावकों का उपयोग करते हैं जैसे gruntबिल्ड ऑटोमेशन को संकलित करना (संकलन, छोटा करना, परीक्षण करना, आदि)। का उपयोग करना grunt-contrib-watch, grunt-contrib-lessऔर grunt-contrib-livereload, आप वास्तव में अपने विकास वर्कफ़्लो को कारगर बना सकते हैं।

उदाहरण के लिए, यदि आप yoअपनी नई वेब परियोजना का उपयोग करते हैं, तो परिवर्तन के लिए अपनी LESS / CSS / JS / HTML फ़ाइलों को देखने के लिए और जरूरत पड़ने पर अपने प्रोजेक्ट के आवश्यक भागों को फिर से जोड़ने के लिए इसे पूर्वनिर्मित किया जाता है। बस चलाएं grunt serve, और आप मैन्युअल रूप से संकलन (लेस / एसएएस / कॉफीस्क्रिप्ट) के बारे में चिंता किए बिना कोड करने के लिए तैयार हैं / अपने कोड को संक्षिप्त या संक्षिप्त कर रहे हैं या अपने ब्राउज़र को मैन्युअल रूप से एक गुफाओं की तरह ताज़ा कर रहे हैं ...

— लेसे मेजेस्टे
स्रोत

1

मुझे यकीन नहीं है कि आप किस संस्करण का उपयोग कर रहे हैं। नवीनतम संस्करण 1.3.0 में कोई - वॉच सुविधा नहीं है। - वॉच फीचर के लिए एक पुल अनुरोध 9 महीने पहले शूट किया गया था। github.com/cloudhead/less.js/pull/246

— जेरार्ड रोच

@BullfrogBlues: क्षमा करें, यह पुराने रूबी-आधारित पट्टिका से था।

— लेसे मेजेस्टे सेप

नोट: "कम-वॉच का नाम बदलकर fs-change कर दिया गया है। इसके बजाय इसका उपयोग करें: npm install -g fs-change"

— एंड्रयू लॉट

6

सर्वर पर LESS to CSS को संकलित करने के लिए कई विकल्प हैं, और जो आप चुनते हैं वह संभवतः इस बात पर निर्भर करेगा कि आप बाकी साइट के लिए क्या उपयोग करते हैं।

यदि आप नोड.जेएस का उपयोग करते हैं, तो मूल पट्टियाँ काम करेंगी।
यदि आप PHP का उपयोग करते हैं, तो कम । जब पीएचपी से वेरिएबल पास करने की बात आती है, तो इसमें थोड़ी बकवास एपीआई होती है, लेकिन यह काम करता है।
यदि आप रूबी का उपयोग करते हैं, तो SASS LESS नहीं है, लेकिन यह समान है कि जब मैंने SASS (व्यक्तिगत परियोजना) का उपयोग LESS (काम में एक PHP परियोजना) से किया तो मुझे फ़ाइल एक्सटेंशन के अलावा कोई अंतर दिखाई नहीं दिया। इसमें मिक्सिंस का एक उपयोगी पुस्तकालय भी है - कम्पास । मैंने उन्हें कम उपयोग करने की कोशिश नहीं की है, लेकिन मुझे उम्मीद है कि वे काम करेंगे। (जाहिर तौर पर LESS मूल रूप से रूबी था, इसलिए शायद एक पुराना संकलक कहीं आसपास भी तैर रहा है)।
यदि आप ASP.Net का उपयोग करते हैं, तो .less । मैंने इसका उपयोग नहीं किया है, इसलिए मुझे नहीं पता कि यह कितना अच्छा काम करता है।
यदि आप जावा का उपयोग करते हैं, तो मूल LESS और Java 6 के अंतर्निहित राइनो स्क्रिप्टिंग वातावरण के साथ संकलन के लिए , cscs4j लपेटता है।
यदि आप पर्ल का उपयोग करते हैं, तो सीपीएएन में एक एलईएसपी मॉड्यूल है।

— पीटर टेलर
स्रोत

2

वहाँ है एक रूबी संकलक है कि पुराने कम रूबी मणि के साथ आता है, लेकिन यह अब और अद्यतन इसलिए नई सुविधाओं के एक बहुत कुछ इस पर काम नहीं करेगा नहीं है। इस प्रकार, यदि आप रूबी का उपयोग करते हैं, तो मैं बस lesscद्विआधारी संकलक का उपयोग करने की सलाह दूंगा जो कि कम से कम नवीनतम संस्करण से आधारित है।

— लेसे मेजेस्टे

@ Lèsemajesté, मैं सिर्फ SASS के साथ जाऊंगा, लेकिन मैं रूबी में LESS को संकलित करने की संभावना को नजरअंदाज करने का आरोप नहीं लगाना चाहता था।

— पीटर टेलर

1

हाँ, मुझे लगता है कि जेएस के स्विच के बाद से लेस मणि को हटाए जाने के बाद SASS रूबी के लिए सबसे अच्छा विकल्प होगा।

— लेज़े मेजेस्टे