2015-01-28 7 views
9

मैं ब्राउज़र और कारक-बंडल के साथ गल्प का उपयोग कर रहा हूं। मैं निम्नलिखित कोड है:कारक-बंडल के आंशिक बंडलों पर कुछ संचालन करें

b = browserify({ 
     entries: [ 'a.js', 'b.js'], 
     plugin: [ [ 'factor-bundle', { outputs: [ 'build/a.js', 'build/b.js' ] } ] ] 
    }) 
    .bundle() 
    .pipe(source('bundle.js')) 
    .pipe(buffer()) 
    .pipe(gulp.dest('/build/common')); 

मैं पाइप करना चाहते हैं कुछ कार्यों (जैसे कुरूप कर देना, बंडल-collapser या अन्य काम) parial बंडलों ('निर्माण/a.js' और 'निर्माण/b.js पर ')। मैं विधि कारक-बंडल के पृष्ठ पर वर्णित का उपयोग करने की कोशिश की:

b.plugin('factor-bundle', { outputs: [ write('x'), write('y') ] }); 
function write (name) { 
    return concat(function (body) { 
     console.log('// ----- ' + name + ' -----'); 
     console.log(body.toString('utf8')); 
    }); 
} 

लेकिन मैं लिखने() विधि समझ में नहीं आता और पता नहीं कैसे uglification और कैसे परिणाम gulp.dest को प्रदर्शन करने के लिए।
कोई विचार? स्पष्टीकरण?

उत्तर

10

write() विधि एक लिखने योग्य धारा देता है जो आपको पाइप बंडल को आगे डाउनस्ट्रीम ट्रांसफॉर्मेशन के माध्यम से कारक-बंडल प्लगइन द्वारा जेनरेट करने की अनुमति देता है।

उदाहरण के लिए, अपने write() विधि कुछ इस तरह लग सकता है:

var path = require('path'); 
var file = require('gulp-file'); 
var sourcemaps = require('gulp-sourcemaps'); 

function write (filepath) {  
    return concat(function (content) {   
     // create new vinyl file from content and use the basename of the 
     // filepath in scope as its basename. 
     return file(path.basename(filepath), content, { src: true }) 
     // uglify content 
     .pipe(uglify()) 
     // write content to build directory 
     .pipe(gulp.dest('./build/scripts'))   
    }); 
} 

और तुम इस तरह यह प्रयोग करेंगे:

browserify({ 
    entries: [ 'a.js', 'b.js'], 
    plugin: [ [ 'factor-bundle', { outputs: [ write('a.js'), write('b.js') ] } ] ] 
}) 
.bundle() 
.pipe(write('common.js')) 
// Could have use these instead, but it wouldn't be as DRY. 
// .pipe(source('common.js')) 
// .pipe(uglify()) 
// .pipe(gulp.dest('./build/scripts')) 

factor-bundle प्लगइन का उपयोग करना .bundle() के बाद browserify के उत्पादन को प्रभावित करता है कहा जाता है। आम तौर पर, यह आपके प्रत्येक प्रविष्टि फ़ाइलों को पढ़ने योग्य धारा मैपिंग के रूप में बंडल उत्पन्न करेगा, फिर आप उन्हें रूपांतरणों को लागू करने में सक्षम होंगे।

इसके बजाय आप एक ही पठनीय धारा है कि आपूर्ति की प्रविष्टि फ़ाइलें, जो मैं ऊपर के उदाहरण पर common.js कहा जाता है से साझा आम मॉड्यूल के साथ एक बंडल में शामिल हो जाएगा। फिर आपको पढ़ने योग्य धाराओं के ट्रांसफोमेशन को संभालने की आवश्यकता है जो प्रत्येक प्रविष्टि फ़ाइल को अलग से मैप करते हैं।

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

आप कर सकते थे भी लाभ उठाने factor.pipelineevent:

var b = browserify({ ... }); 

b.on('factor.pipeline', function (id, pipeline) { 
    pipeline.get('wrap').push(write(id)); 
}); 

b.plugin(factor); 

return b.bundle().pipe(write('common.js')); 

मुझे लगता है कि यह ध्यान देने योग्य है कि आउटपुट के लिए आगे नीचे की ओर काम को लागू करने के लिए पूरी तरह से पाइप लाइन से अलग है लायक है। तो यदि आप गल्प का उपयोग कर रहे थे और ब्राउज़र ब्राउज़र से स्ट्रीम लौटाएंगे, तो कार्य समय से पूरा हो गया होगा क्योंकि यह अभी भी प्रविष्टि फ़ाइलों पर संचालन कर रहा होगा। मैंने अभी तक समस्याओं में भाग नहीं लिया है।

उम्मीद है कि इससे मदद मिलती है।

+1

विस्तृत समाधान के लिए धन्यवाद। किसी भी विचार को हल करने के लिए कि मैं इस धारा को कैसे हल कर रहा हूं जो कार्य को पूरा करने का प्रतिनिधित्व नहीं करता है? – Naor

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