Emmet LiveStyle - सुविधाजनक फ्रंट-एंड डेवलपमेंट के लिए एक उपकरण

दूसरे दिन, शायद फ्रंट-एंड डेवलपर्स के लिए सबसे सुविधाजनक उपकरण दिखाई दिया है - एम्मेट लाइवसटाइल । यह सीएसएस फ़ाइलों के दो-तरफ़ा (ब्राउज़र संपादक) संपादन के लिए प्लग-इन है, जो विकास को काफी सुविधाजनक और तेज़ कर सकता है। इंटरनेट के आस-पास की उत्साही समीक्षाएं इसकी पुष्टि करती हैं ( लेख स्मैशिंग मैगज़ीन और हैबे पर टिप्पणी)।

Emmet LiveStyle का मुख्य लाभ यह है कि सभी परिवर्तन आसानी से और सहज रूप से किए जाते हैं, और परिणाम मक्खी पर दिखाई देता है। यह वास्तव में प्रक्रिया को गति देगा। लंबे समय तक प्लगइन के फायदों के बारे में बात करना संभव है, लेकिन वीडियो प्लगइन के काम को सबसे अच्छा दिखाता है:



परियोजना सार्वजनिक बीटा मोड में है। जबकि टूल Google Chrome, Safari और Sublime Text में काम करता है। भविष्य में, अन्य ब्राउज़रों के लिए समर्थन की योजना बनाई गई है।

अवसरों

• परिणाम परिवर्तन करने के तुरंत बाद दिखाई देता है - कोई पृष्ठ सहेजता या अपडेट नहीं करता है।
• फ़ाइलों को स्थानीय रूप से संग्रहीत करने की आवश्यकता नहीं है, संपादन के लिए उन्हें सीधे एफ़टीपी से खोला जा सकता है।
• क्रॉस-प्लेटफॉर्म।
• परिणाम कई खिड़कियों में एक साथ देखा जा सकता है, सभी परिवर्तन मक्खी पर घटित होंगे। उत्तरदायी डिजाइन के परीक्षण के लिए सुविधाजनक है।
• आप एक ही समय में कई साइटों को संपादित कर सकते हैं, उदाहरण के लिए, डेस्कटॉप और मोबाइल संस्करण।
• आसान स्थापना और संचालन: बस संपादक में CSS फ़ाइल खोलें और इसे साइट शैलियों फ़ाइल से लिंक करें।

स्थापना

निम्न Google Chrome के लिए स्थापना प्रक्रिया का वर्णन करता है।

1. उदात्त पाठ 3 के लिए पैकेज नियंत्रण स्थापित करें।
2. उदात्त पाठ में, कमांड पैलेट (Ctrl + Shift + P) खोलें और पैकेज नियंत्रण: पैकेज स्थापित करें चुनें।
3. सूची में, LiveStyle एक्सटेंशन ढूंढें और इंस्टॉल करें।
4. Google Chrome के लिए एक्सटेंशन इंस्टॉल करें।
5. Sublime Text में CSS फाइलें खोलें।
6. ब्राउज़र में संपादन के लिए पृष्ठ खोलें
7. DevTools (Ctrl + Shift + I) खोलें और LiveStyle टैब में, साइट शैली फ़ाइलों को सबटाइम टेक्स्ट में खोले गए लोगों के साथ संबद्ध करें। काम करने के लिए प्लगइन के लिए, DevTools प्रत्येक खिड़की के लिए खुला रखा जाना चाहिए।

विकास के लेखक गीक पत्रिका पर है - चिकुनोनोक । विवरण आधिकारिक वेबसाइट और स्मैशिंग पत्रिका लेख में पाया जा सकता है।