Gulp src 忽略递归复制的部分 glob 路径

Question

我想将一些 openui5 资源文件从 bower 包复制到我的输出文件夹中。它们都有一个共同的前缀（openui5-）。它们都有一个名为 "resources" 的子文件夹。我想将该子文件夹中的内容复制到输出中的一个公共 "resources" 文件夹。

我想用 glob 来复制它们 gulp。现在我必须明确给出每条路径

['bower_components/openui5-sap.m/resources/**/*',
 'bower_components/openui5-sap.ui.core/resources/**/*',
 'bower_components/openui5-themelib_sap_belize/resources/**/*']

我想使用这样的模式：

'bower_components/openui5-*/resources/**/*'

但是如果我这样做，我也会复制完整的模块名称，所以我的资源文件夹如下所示：

out/resources/
+ -- openui5-sap.m/resources/...
+ -- openui5-sap.ui.core/resources/...
+ -- openui5-themelib_sap_belize/resources/...

据我了解，这是因为默认情况下 gulp.src 采用第一个 glob（在模块名称中）并从那里构建递归结构。

有没有办法忽略输出的部分 glob 模式或 trim 使用另一个 glob 的输出路径？

我四处寻找解决方案，但我找不到任何东西。

gulp-重命名似乎使整个层次结构扁平化：

gulp.task('copyui5resources', function() {
    gulp.src('bower_components/openui5-*/**/*')
        .pipe(rename({ dirname: '' }))
        .pipe(gulp.dest('out/resources'));
});

使用基本选项也无济于事。好像只复制了一部分:

gulp.task('copyui5resources', function() {
    gulp.src('bower_components/openui5-*/**/*', {base: 'bower_components/openui5-*'})
        .pipe(gulp.dest('out/resources'));
});

这是我的输入文件夹结构和到目前为止的 gulp 任务的屏幕截图。感谢您的帮助！

Answer 1

您尝试使用 gulp-rename 的方向正确。但是 dirname 选项对于您想要完成的事情来说还不够强大，因为它只能替换整个目录结构。您只想替换其中的一部分。

对于像这样的情况 gulp-rename 可以提供一个函数，它允许您使用 JavaScript 必须提供的所有内容来改变 dirname，包括 string.replace()。

这意味着你可以这样做：

var gulp = require('gulp');
var rename = require('gulp-rename');

gulp.task('default', function() {
  return gulp.src('bower_components/openui5-*/resources/**/*')
    .pipe(rename(f => f.dirname = f.dirname.replace(/openui5-.*?\//, '')))
    .pipe(gulp.dest('out/'));
});

Answer 2

谢谢斯文的帮助，

我今天早上在阅读你的 post 之前在另一个 post 中偶然发现了这个提示 :( 我删除了路径的前两部分并得到了想要的结果。它有优势，您可以跳过任意多的部分，并且正则表达式解决方案具有捕获更多相似路径部分的优势。

完成：这是我想出的解决方案：

var gulp = require('gulp'),
    rename = require('gulp-rename'),
    path = require('path');

gulp.task('copyui5resources', function() {
    gulp.src('bower_components/openui5-*/resources/**/*')
        .pipe(rename(function(p) {
            var nda = p.dirname.split(/[\\/]/);
            nda.splice(0, 2); 
            p.dirname = nda.length > 0 ? path.join.apply(null, nda) : "";
        }))
        .pipe(gulp.dest('out/resources'));
});

我使用路径重新加入独立于 OS 的路径。 Splice 删除了包名和资源目录的前两部分。您必须使用 path.join.apply，因为它会展平数组，否则会出现错误。

Gulp src 忽略递归复制的部分 glob 路径

Gulp src ignore part of glob path for recursive copy

glob

copy

gulp