Gulp 4 - Fehler: schreibe nach Ende

Question

Ich erhalte einen Fehler, wenn ich auf Änderungen in index.html (vollständiger Pfad in CONFIG.APP.INDEX) aufpasse. Alle meine Aufgaben sind in separaten Dateien. dies ist Aufgaben/watch.ts, zum Beispiel:

import * as CONFIG from '../config'; 

export default done => { 
    // other watches 
    gulp.watch(CONFIG.APP.INDEX, gulp.series('inject')); 
}; 

auf ersten Änderungs Aufgabe wird normalerweise ausgeführt, aber auf den zweiten Änderung dieser Fehler Ich erhalte:

c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:203 
    var er = new Error('write after end'); 
     ^
Error: write after end 
    at writeAfterEnd (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:203:12) 
    at DestroyableTransform.Writable.write (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_writable.js:239:20) 
    at DestroyableTransform.ondata (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_readable.js:531:20) 
    at emitOne (events.js:77:13) 
    at DestroyableTransform.emit (events.js:169:7) 
    at readableAddChunk (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_readable.js:198:18) 
    at DestroyableTransform.Readable.push (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_readable.js:157:10) 
    at DestroyableTransform.Transform.push (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:123:32) 
    at afterTransform (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:79:51) 
    at TransformState.afterTransform (c:\~\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:58:12) 
    at c:\~\node_modules\vinyl-fs\lib\src\getContents\bufferFile.js:18:5 
    at c:\~\node_modules\graceful-fs\graceful-fs.js:78:16 
    at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:404:3) 

Aufgaben/injizieren .ts Aufgabe:

declare var require; 
const gulp = require('gulp'); 
const plugins = require('gulp-load-plugins')(); 
import * as CONFIG from '../config'; 

export default done => { 
    return gulp 
    .src(CONFIG.APP.INDEX) 

    .pipe(require('../util/inject/fixes').default) // <--- PROBLEM IS HERE 
    // other stuff... 
    .pipe(gulp.dest(CONFIG.DST.BUILD)) 
    .on('error', plugins.util.log); 
}; 

util/inject/fixes.ts Aufgabe

declare var require; 
const plugins = require('gulp-load-plugins')(); 

// errors even with this... 
export default plugins.util.noop(); 

Aufgaben werden von gulpfile.ts/index.ts wie folgt geladen:

fs.readdirSync('./gulpfile.ts/tasks').map(file => { 
    let name = file.replace(/\.ts$/, ''); 
    let task = require(path.join(path.resolve('.'), 'gulpfile.ts', 'tasks', file)); 
    gulp.task(name, task.default); 
}); 

Ich habe es geschafft, zu ermitteln, wo der Fehler herkommt, aber keine Ahnung, was es verursacht, oder wie man es beheben. Problem tritt nur auf, wenn index.htmlnach der ersten Änderung und Ausführung der Aufgabe angesehen wird. Die Ausführung der Aufgabe wird manuell ausgeführt (gulp inject), und alle anderen Überwachungen und Aufgaben funktionieren normal.

Answer 1

Ich vermute, dass Ihre Implementierung von fixes.ts dasselbe noop() Ergebnis wiederverwendet, anstatt das Ergebnis jedes Mal neu zu erstellen, wenn die Aufgabe ausgeführt wird.

Versuchen Sie, die fixes.ts zurückzukehren, um eine Fabrik Funktion Umwandlung, die die Aufgabe, eine neue noop Instanz jedes Mal aufgerufen wird zurückkehren.

util/inject/fixes.ts:

declare var require; 
const plugins = require('gulp-load-plugins')(); 

// Return a function that will return a new `noop` instance each time: 
export default() => { 
    return plugins.util.noop(); 
}; 

---

Für Kontext, ich hatte gerade ein ähnliches Problem in meinem Projekt, wo ich aus Versehen einen Schluck Strom wurde die Wiederverwendung und immer die „schreibe nach Ende "Fehler.

Ich vermute, dass Ihr Code die gleiche Art von Sache mit dem noop() Ergebnis tut, weil dieser Wert als der Wert dieses Moduls zwischengespeichert wird.

Falsche Version meiner gulpfile.js - das Ergebnis meiner gulp.dest() Anrufe wurde jedes Mal wiederverwendet.

let gulp = require('gulp'); 
let merge = require('merge-stream'); 

let _path = require('path'); 

let files = { 
    'html': { 
     src: _path.join('public', 'index.html'), 
     dest: gulp.dest('public') // <-- WRONG use of `gulp.dest()`, causes result to be reused and gives "write after end" error 
    }, 
    'files': 'html': { 
     src: _path.join('files', '*'), 
     dest: gulp.dest('files') // <-- WRONG use of`gulp.dest()` 
    }, 
}; 

gulp.task('copy', function(){ 
    let html = gulp.src(files.html.src) 
     .pipe(files.html.dest); // <-- `gulp.dest()` should be here 

    let files = gulp.src(files.files.src) 
     .pipe(files.files.dest); // <-- `gulp.dest()` should be here 

    return merge(html, files); 
}); 


gulp.task('copy-watch', function(){ 
    let srcList = Object.keys(files).map(i => files[i].src); 
    gulp.watch(srcList, ['copy']); 
}); 

Fest Version meiner gulpfile.js - gulp.dest() wird jedesmal, wenn die Aufgabe ausgeführt wird genannt:

let files = { 
    'html': { 
     src: _path.join('public', 'index.html'), 
     dest: 'public' // <-- removed `gulp.dest()` call from here 
    }, 
    'files': 'html': { 
     src: _path.join('files', '*'), 
     dest: 'files' // <-- removed `gulp.dest()` call from here 
    }, 
}; 

gulp.task('copy', function(){ 
    let html = gulp.src(files.html.src) 
     .pipe(gulp.dest(files.html.dest)); // <-- CORRECT use of`gulp.dest()` 

    let files = gulp.src(files.files.src) 
     .pipe(gulp.dest(files.files.dest)); // <-- CORRECT use of `gulp.dest()` 

    return merge(html, files); 
});