Создайте цикл for для нескольких имен файлов в функции Gulp.js 4 - PullRequest
0 голосов
/ 21 октября 2019

В настоящее время я пытаюсь использовать один спрайт svg на страницу, чтобы он загружал только svg для каждой отдельной страницы. В настоящее время работает, но я хочу создать массив, чтобы задача вызывалась для N страниц, которые я хочу.

В настоящее время у меня есть такая структура в gulpfile.js (версия 4):

var autoprefixer = require('autoprefixer'),
    browsersync = require('browser-sync').create(),
    cssnano = require('cssnano'),
    sourcemaps = require('gulp-sourcemaps'),
    del = require('del'),
    gulp = require('gulp'),
    imagemin = require('gulp-imagemin'),
    newer = require('gulp-newer'),
    plumber = require('gulp-plumber'),
    postcss = require('gulp-postcss'),
    rename = require('gulp-rename'),
    sass = require('gulp-sass'),
    svgSprite = require('gulp-svg-sprite');

//Create SVG's into one single image file
function svgs(){
    return gulp
        .src('app/images/src/pageName/*')
        .pipe(svgSprite({
           shape: {
               spacing: {
                   padding: 5
               }
           },
           mode: {
               css: {
                   dest: './',
                   layout: 'diagonal',
                   sprite: 'images/dist/pageName/sprite.svg',
                   bust: false,
                   render: {
                       scss: {
                           dest: 'sass/modules/sprites/_pageName.scss',
                           template: 'app/sass/modules/sprites/_pageNameTemplate.scss'
                       }
                   }
               }
           },
           variables: {
               mapname: 'icons'
           }
       }))
       .pipe(gulp.dest('app/'));
}

exports.svgs = svgs;

Идея состоит в том, чтобы создать массив с именами страниц и выполнить цикл for:

    var pages = ['page1', 'page2',...];

    function svgs(){
        for (var i = 0; i < pages.length; i++) {

            return gulp
                 .src('app/images/src/' + pages[i] + '/*').........
    }

и затем в консоли просто вызовите задачу, но при возврате она выполняется только за одну итерацию, у кого-нибудь такое было раньше?

Спасибо!

1 Ответ

1 голос
/ 21 октября 2019

Попробуйте glob.sync возвращает массив:

const glob = require('glob');

const pageArray = glob.sync('path/to/your/*.pages');

function svgs(done)  {

  pageArray.forEach( page => {
    return gulp.src(page)
      ...
  };
  done();
}
...