Gulp在多个Wordpress主题文件夹中编译LESS,并创建相应的CSS文件夹



我正试图让Gulp从一个LESS文件夹编译我的所有LESS文件,然后在它们各自的Wordpress主题文件夹中创建一个CSS文件夹,该文件夹被编译成一个目录CSS/main.CSS文件。这是使用Wordpress wp-content/themes/theme-name/liss作为文件结构。每次我尝试编译时,它都会将其放入/themes/**文件夹,或者如果我使用.pipe(gulp.dest('./css/'));它在项目的根目录中创建它。我希望它在每个主题文件夹中创建一个新的css文件夹,并根据它们各自的LESS文件将main.css编译到每个文件夹中。

gulp.task('less', ['clean'], function () {
var paths = [
    "wp-content/themes/theme-name-1/less/_compile.less",
    "wp-content/themes/theme-name-2/less/_compile.less",
    "wp-content/themes/theme-name-3/less/_compile.less"
];
var compile = gulp.src(paths, { base: './'})
    .pipe(rename({
        basename: "main",
        extname: ".css"
    }))
    .pipe(sourcemaps.init())
    .pipe(less())
    .pipe(autoprefixer())
    .pipe(sourcemaps.write('./css'))
    .pipe(gulp.dest('wp-content/themes/**/css'));
return (compile);
  });

我希望它发生的方式是:

当您运行gulp时,它会编译并创建一个文件夹:wp-content/themes/theme-name/css from wp-content./themes/theme-name]less。我希望它在每个主题名称文件夹中查找,并创建一个相应的/css/文件夹,编译后的文件为main.css.

现在,它似乎正在wp-content/themes的根目录中创建一个**文件夹。

gulp.dest是放置文件的目的地,因此.pipe(gulp.dest('wp-content/themes/**/css'));将把编译后的文件放在文件夹wp-content/themes/**/css中。

因此,将其更改为您希望放置文件的目的地,因此可以这样使用它:.pipe(gulp.dest('wp-content/themes/theme-name/css'));

相关内容

  • 没有找到相关文章

最新更新