简体   繁体   中英

how do i wait for the task in GULP4 SERIES

I have an error "Could not find file SVG" in the task 'svg:inject'.

So what's happens: the task 'svg:sprite' generates file sprite.svg. Then in the task 'svg:inject' I want to use this sprite.svg to move it in html. But I have an error ((

Have you any ideas about this behavior and about solving it?

gulp.task('svg:sprite', (done) => {
    gulp.src('./resources/svg/sprite/*.svg')
        .pipe(svgstore())
        .pipe(dest('./resources/svg/'));
    done();
});

gulp.task('svg:inject', gulp.series('svg:sprite', (done) => {
    gulp.src('./resources/svg/sprite-svg.html')
        .pipe(injectSvg({
            base: './resources/svg/'
        }))
        .pipe(dest('./resources/_code/templates/'));
    done();
}));

sprite-svg.html file:

<div class="hide">
    <img src="sprite.svg">
</div>

Return the stream instead of using the done callback:

gulp.task('svg:sprite', () =>
  gulp.src('./resources/svg/sprite/*.svg')
    .pipe(svgstore())
    .pipe(gulp.dest('./resources/svg/'))
);

gulp.task('svg:inject', gulp.series('svg:sprite', () =>
  gulp.src('./resources/svg/sprite-svg.html')
    .pipe(injectSvg({
        base: './resources/svg/'
    }))
    .pipe(gulp.dest('./resources/_code/templates/'))
));

TheDancingCode thanks! It helps.

But one question: I try to use require for tasks. And in this case, I get an error message:

The following tasks did not complete: svg:inject, svg:sprite
Did you forget to signal async completion?

What is wrong?

Code:

function getTask(task, path_src, path_dest) {
    return require('./tasks/' + task)(gulp, plugins, path_src, path_dest);
};

gulp.task('svg:sprite', () => {
    getTask('svg-sprite', CONFIG.src.svg_sprite, CONFIG.src.svg)
});

gulp.task('svg:inject', gulp.series('svg:sprite', () => {
    getTask('svg-inject', CONFIG.src.svg, CONFIG.src.html_templates)
}));

And an example of a task module (svg-sprite.js):

module.exports = function (gulp, plugins, path_src, path_dest) {
    gulp.src(path_src)
        .pipe(plugins.svgstore())
        .pipe(gulp.dest(path_dest));
};

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM