使用 gulp 选择和移动目录及其文件

Posted

技术标签:

【中文标题】使用 gulp 选择和移动目录及其文件【英文标题】:Use gulp to select and move directories and their files 【发布时间】:2014-02-28 02:15:56 【问题描述】:

我目前正在使用 gulp 调用一个 bash 脚本来清理我的 dist/ 目录并将适当的文件移动到干净的目录中。我希望使用 gulp 完成此操作,因为我不确定该脚本是否可以在非 *nix 文件系统上运行。 到目前为止,我正在使用 gulp-clean 模块来清理 dist/ 目录,但是当我尝试将所需的目录及其文件移动到 dist 文件夹时,目录是空的。

var gulp = require('gulp'),
    clean = require('gulp-clean');

gulp.task('clean', function()
  return gulp.src(['dist/*'], read:false)
  .pipe(clean());
);

gulp.task('move',['clean'], function()
  gulp.src(['_locales', 'icons', 'src/page_action', 'manifest.json'])
  .pipe(gulp.dest('dist'));
);

gulp.task('dist', ['move']);

调用gulp dist 会导致dist/ 目录被正确的目录填充,但它们都是空的

$ ls dist/*
dist/manifest.json

dist/_locales:

dist/icons:

dist/page_action:

如何将目录及其内容复制到dist/ 文件夹?

【问题讨论】:

【参考方案1】:

您需要将base option 包含到 src 中,这将按照您想要的方式保留文件结构:

var filesToMove = [
        './_locales/**/*.*',
        './icons/**/*.*',
        './src/page_action/**/*.*',
        './manifest.json'
    ];

gulp.task('move',['clean'], function()
  // the base option sets the relative root for the set of files,
  // preserving the folder structure
  gulp.src(filesToMove,  base: './' )
  .pipe(gulp.dest('dist'));
);

此外,如果您在项目的根目录中拥有所有这些源文件,您可能会遇到麻烦。

如果可以,我建议您使用单个src/ 文件夹并将所有您的应用程序特定文件移动到那里。这使得维护更容易向前推进,并防止您的构建特定文件与您的应用程序特定文件混淆。

如果您这样做,则只需将上面示例中出现的所有 ./ 替换为 src/

【讨论】:

仅在重新组织文件后才能完美运行,但您的推理是合理的,因此我将您的答案标记为正确。谢谢。 相反,使用 gulp-flatten。 ***.com/questions/21153338/… 作为其他人的说明,请确保您没有将 src 中的 read 选项设置为 false(默认设置为 true)。跨度> 当我这样做时,它正在复制整个根目录。【参考方案2】:

原始问题仅针对其gulp.src 中的目录(又名文件夹),即在此示例中为gulp.src(['_locales', ..._locales目录 的名称.

接受的答案在其gulp.src 中使用glob pattern 来定位这些目录中的任何位置的文件,即gulp.src(['./_locales/**/*.*', ...,(注意双星号,和 filename.extension 星号)。接受的答案有效...

...但接受的答案只强调base 选项

您需要在 src 中包含 base 选项...

我实验发现:

    严格来说,没有必要使用 base 选项来实现 OP 所要求的:“......并将适当的 文件 移动到干净的目录。” base 选项 确实 确实保留了 folder+file 结构 (如接受的答案中所述),但 base 选项是不足以按照 OP 要求移动文件。保留文件夹+文件结构可能是 OP期望,所以接受的答案很好,但是......

    重申做什么移动文件,它是glob 模式:

      双星号 (.../**/...) 在所有子文件夹以及子文件夹的子文件夹等中递归搜索。

      Filename.extension 星号 (.../*.*) 查找所有名称文件,以及所有扩展所以我认为这部分最值得强调!

    接受的答案改变了其他东西;它为传递给gulp.src 的每个路径参数添加前缀./。我认为这是不必要/多余的;如果没有 ./,(如 OP 问题中所示),则路径相对于当前目录进行解析——导致相同的行为。但也许最好用./

如果我弄错了请告诉我...

【讨论】:

感谢您的解释。我不需要 base 选项,但我需要完全按照您的描述指定 *.* 以实际移动正确的文件。 +1

以上是关于使用 gulp 选择和移动目录及其文件的主要内容,如果未能解决你的问题,请参考以下文章

需要使用 DOS 命令或批量编程复制一组选择性目录及其文件

[如何在mac下使用gulp] 2. gulp模块的常用方法

《移动Web前端高效开发实战》笔记2——使用Gulp构建一个ECMAScript 6和Sass应用

gulp-babel使用

使用 gulp 编译 Sass

gulp-webserver