2014-07-17 10 views
7

के लिए लिंक मैंने फ्रंट-एंड डेवलपमेंट वर्किंग एनवायरनमेंट सेट अप करने के लिए एक गिल्फ़फाइल बनाया है।एचटीएमएल फाइल को इंजेक्ट करने के लिए गलप का उपयोग कैसे करें स्थापित बोवर पैकेज

यहाँ है कि यह कैसे काम करता है:

स्क्रिप्ट पकड़ लेता है बोवर/सार्वजनिक फ़ोल्डर हर स्थापित पैकेज का मुख्य फ़ाइलें, जे एस और उनके संबंधित उत्पादन फ़ोल्डर में सीएसएस (करने के लिए bower.json और आउटपुट में परिभाषित संकुल/सार्वजनिक/जेएस) (/ सार्वजनिक/सीएसएस)।

स्क्रिप्ट भी सभी फाइलों, सीएसएस, जेएस और एचटीएमएल फाइलों पर एक घड़ी का काम शुरू करती है और जब भी मैं उन फ़ाइलों को विकास फ़ोल्डर (/ src) पर सहेजता हूं तो उनके/सार्वजनिक समकक्ष वास्तविक समय में अपडेट किए जाएंगे।

इस तरह मैं बस बोवर के साथ स्थानीय रूप से पैकेज स्थापित करता हूं और इस gulpfile को चलाकर मेरे पास उत्पादन फ़ाइलों को मेरे/सार्वजनिक फ़ोल्डर में तैयार किया जाएगा, लेकिन मुझे उन्हें लिंक करने की आवश्यकता है!

जैसा कि कहा गया है, गायब भाग मैं चाहता हूं कि मैं अपने सूचकांक.html के सिर में उन फ़ाइलों के लिंक लिखने के लिए स्क्रिप्ट चाहता हूं, इस आधार पर कि मैंने बोवर से किस पैकेज को स्थापित करने का निर्णय लिया था।

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

यहाँ github पर मेरी स्क्रिप्ट है, README पर एक नजर है और कम से gulpfile:

मैं नहीं जानता कि क्या दृष्टिकोण और/या एक घूंट कि प्राप्त करने के लिए उपयोग करने के लिए प्लगइन है या नहीं, किसी को इंगित कर सकते हैं यदि मुझे सही दिशा में मैं बहुत सराहना करता हूं। धन्यवाद।

उत्तर

5

इसके लिए मैं वर्तमान में gulp-inject का उपयोग करता हूं, एक आकर्षण की तरह काम करता है!

+0

का उपयोग करके इसे अपने एचटीएमएल में जोड़ने की आवश्यकता के बाद, मैं वास्तव में जो देख रहा था, धन्यवाद दोस्त। – pwnjack

3

मैं भी इसकी तलाश कर रहा था। और ऐसा लगता है कि gulp-processhtml प्लगइन इस कार्य और/या gulp-replace और/या gulp-preprocess के लिए उपयुक्त हो सकता है।

3

कैसे सिर्फ

gulp wiredep 

उदाहरण का उपयोग कर के बारे में:

मौजूदा Yeoman/बोवर/Gulp परियोजना के लिए Holder.js पैकेज जोड़ें।

bower install holderjs --save 

यह इसे निर्भरता सरणी में जोड़ा गया।

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

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