Question

我的问题从另一个问题开始，在这里问：Gulp: How to set dest folder relative to processed file (when using wildcards)?

我有类似的情况，我需要在每个模块的基础上制作压缩版本。也就是说，我有

ui/test/one/script1.js
ui/test/two/script2.js

我需要gulp将文件复制到相关目录中，所以我最终得到了

ui/test/one/compressed/script1.js
ui/test/two/compressed/script2.js

我有以下gulp任务

gulp.task('test', function() {
    return gulp.src('ui/test/**/*.js')
        .pipe(gulp.dest(function(file) {
            return path.join(path.dirname(file.path), 'compressed');
        }));
});

但是，当我运行它时，我最终会

ui/test/one/compressed/one/script1.js
ui/test/two/compressed/two/script2.js

我在docs中看到了

cwd - 指定文件夹相对的工作目录。 base - 指定相对于cwd的文件夹。默认是glob开始的地方。保存在.dest（）
时，用于确定文件名

我有几个问题，特别是关于.src()，.dest()以及路径和文件对象。（也就是说，虽然我确信还有其他方法可以实现我的最终目标，但这个问题具体是关于上面的示例gulp代码的行为和提到的函数，所以我可以更好地理解他们的行为和API。< /强>）

问题

当文档说“文件夹相对于工作目录”时，这是什么文件夹？

在同一个注释中，与this comment和文档中的位置相关，它表示“base - 指定相对于cwd的文件夹。默认是glob开始的位置”是什么？ “ 意思？我对'glob'的理解是它是整个字符串，但它是否真的意味着该字符串中的*字符？因此，对于存储在some/folder/a/b/c/foo.js的文件的'some / folder / ** / *。js'，我不确定基数是some/folder/，some/folder/a/还是{{1} }？

有没有办法说some/folder/a/b/c/？

我在说path.join（path.dirname（file.path），'compressed'）我假设它正在生成<where the glob begins> + '..'。接下来，无论什么决定文件的实际名称都考虑C:\blah\ui\test\one\compressed。我如何改变主意，以便只考虑one\script1.js？

注意：我尝试执行以下操作（使用gulp-debug）

script1.js

对于此版本的任务，控制台具有以下输出：

gulp.task('test', function() { return gulp.src('ui/test/**/*.js', {cwd: './'}) .pipe(debug({minimal: false})) .pipe(rename(function(path) { path.basename = path.basename.substring(path.basename.lastIndexOf('\\') + 1); })) .pipe(debug({minimal: false})) .pipe(gulp.dest(function(file) { return path.join(path.dirname(file.path), 'compressed'); })); });

因此看起来重命名对路径没有影响。我也尝试在重命名管道中修改path.dirname，但是找不到任何能够简单地从最终输出路径中删除虚假目录名称的效果。

那么，我的最后一个问题是path.basename和path.dirname究竟是什么包含传递给重命名函数的路径对象？

编辑：我找到了关于如何调试gulp任务的this。使用重命名函数中的cwd: ./ base: C:\blah\ui\test path: C:\blah\ui\test\one\script1.js cwd: ./ base: C:\blah\ui\test path: C:\blah\ui\test\one\script1.js cwd: ./ base: C:\blah\ui\test path: C:\blah\ui\test\two\script2.js cwd: ./ base: C:\blah\ui\test path: C:\blah\ui\test\two\script2.js语句执行此操作允许我检查路径对象，如下所示：

debugger;

在重命名中将path.dirname设置为{ basename: "script1", dirname: "one", extname: ".js" }会导致

''

所以重命名（）本身可能对我需要的东西没用。它看起来更像是.src（）的基本选项可能是关键所在，但文档相当简洁。

Answer 1

问题1：

gulp.src('ui/test/**/*.js')

这一行将'/ ui / test /'设置为你的根目录（'工作文件目录'），因为它是你的glob模式的基础。这就是为什么输入dest的'相对路径'是'one / script1.js'和'two / script2.js'。

问题2：

通过glob，文档指的是你的'** / * .js'模式。所以你的glob的基础与你的根目录'/ ui / test /'一样，在这种情况下意味着与“相对于cwd的文件夹”相同的东西。

问题3：

每个路径的'base'属性设置类似于来自gulp.src流的每个文件的glob2base模块。

glob2base(new glob.Glob('/ui/test/**/*.js')) + '..';

与

相同

file.base + '..';

如果这对你有意义的话。

问题4：

我假设您在第二部分代码中使用了gulp-rename。所以这应该可以解决你的问题。

gulp.src('ui/test/**/*.js')
    .pipe(rename(function(path){
        path.basename = 'compressed/' + path.basename;
    })
    .pipe(gulp.dest(function(file) {
        return file.base;
    }));

可以找到可以传递给gulp.src的其他选项here，但我不认为它们中的任何一个直接解决了你想要做的事情。 gulp.src似乎并不希望你在每个路径中间的新目录中进行攻击，因此重命名是最简单的解决方案。

我不会责怪你在解决问题时遇到问题。我不得不在三到四个不同的github页面之间跳转来拼凑一切。希望你能像我一样学到这一点。

关于gulp .pipe（）

1 个答案: