在多个文件夹上运行一个 gulp 任务.文件夹看起来像 plugins/lsmwp-* [英] Run one gulp task on multiple folders. The folders look like plugins/lsmwp-*

问题描述

我创建了很多 WordPress 插件，每个插件都遵循相同的文件夹结构，并且都使用 Gulp 来处理它们的 SASS/JS 资产.

I create a lot of WordPress plugins, each of these all follow the same folder structure and all use Gulp to handle their SASS / JS assets.

文件夹结构如下:

|-- .gulpfile.js

|-- lsmwp-one
    |-- plugin.php
    |-- assets
        |-- src
            |-- style.scss
        |-- dist

|-- lsmwp-two
    |-- plugin.php
    |-- assets
        |-- src
            |-- style.scss
        |-- dist

我想要一个 Gulpfile 来监视每个 'lsmwp-*' 文件夹，运行所有相关任务并输出到插件 dist 文件夹.

I would like to have a single Gulpfile that watches each 'lsmwp-*' folder, runs all related tasks and outputs to plugin dist folder.

我的 Gulpfile 目前正在监视这些文件夹，但我无法设置目标位置.任何帮助将不胜感激.

My Gulpfile currently watches these folders but I am having trouble setting the dest location. Any help would be appreciated.

var pluginSrc = 'wp-content/plugins/lsmwp-*/assets/src/style.scss';

gulp.task('lsmwp-plugins', () => {
    gulp.src( pluginSrc )
    .pipe(sass())
    .pipe(concat('style.min.css'))
    .pipe(autoprefixer())
    .pipe(cssmin())
    .pipe(gulp.dest(); // Stuck here...
});

推荐答案

看起来你有两个问题.一，为每个插件文件夹单独运行任务.二、相对于每个插件文件夹设置目的地.

It looks like you have two issues. One, running the task separately for each plugin folder. Two, setting the destination relative to each plugin folder.

const gulp = require('gulp');
const sass = require('gulp-sass');
const concat = require('gulp-concat');
const autoprefixer = require('gulp-autoprefixer');
const cssmin = require('gulp-cssmin');
const glob = require('glob');

// this gets an array of matching folders
const wpPluginFolders = glob.sync('lsmwp-*');

// for my testing I simplified the folder structure above, you would use
// const wpPluginFolders = glob.sync('wp-content/plugins/lsmwp-*');

const pluginSrc = '/assets/src/style.scss';

gulp.task('default', () => {

  let stream;

  // work on each folder separately
  wpPluginFolders.forEach(function (pluginFolder) {

    stream = gulp.src( pluginFolder + pluginSrc )
      .pipe(sass())
      .pipe(concat('style.min.css'))
      .pipe(autoprefixer())
      .pipe(cssmin())
      .pipe(gulp.dest( pluginFolder + '/assets/dist' ));
  });
  return stream;
});

这篇关于在多个文件夹上运行一个 gulp 任务.文件夹看起来像 plugins/lsmwp-*的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！