如何使用 Gulp 复制多个文件并保持文件夹结构答案

【问题标题】：How to copy multiple files and keep the folder structure with Gulp如何使用 Gulp 复制多个文件并保持文件夹结构
【发布时间】：2015-07-16 01:41:52
【问题描述】：

我正在尝试使用 Gulp 将文件从一个文件夹复制到另一个文件夹：

gulp.task('move-css',function(){
  return gulp.src([
    './source/css/one.css',
    './source/other/css/two.css'

    ]).pipe(gulp.dest('./public/assets/css/'));
});

以上代码是将one.css & two.css 复制到public/assets/css 文件夹中。

如果我使用 gulp.src('./source/css/*.css')，它会将所有 CSS 文件复制到 public/assets/css 文件夹，这不是我想要的。

如何选择多个文件并保持文件夹结构？

【问题讨论】：

@lal css 文件可以位于不同的文件夹中，因此在这种情况下正则表达式没有用恕我直言
问题是像多个文件夹中的文件被复制到一个文件夹public/assets/css ？
是啊，正是，我想这样做

标签： javascript css gulp

【解决方案1】：

为此，请指定base。

¶ base - 指定相对于 cwd 的文件夹。默认值是 glob 的开始位置。这用于在.dest()中保存时确定文件名

在你的情况下是：

gulp.task('move-css',function(){
  return gulp.src([
      './source/css/one.css',
      './source/other/css/two.css'
  ],  {base: './source/'}) 
  .pipe(gulp.dest('./public/assets/'));
});

文件夹结构：

.
├── gulpfile.js
├── source
│   ├── css
│   └── other
│       └── css
└── public
    └── assets

【讨论】：

如果您的文件具有完全不同的目录结构（例如['./lib/one.js', './models/two.js']），您可以添加{base: '.'} 以使其保持整个结构。
如何解析src中的每个文件、文件夹和子文件夹？
请检查src with double ** gulp.src('**/*.*')

【解决方案2】：

我使用 gulp-flatten 并使用这个配置：

var gulp = require('gulp'),
    gulpFlatten = require('gulp-flatten');

var routeSources = {
  dist:  './public/',
  app: './app/',
  html_views: {
    path: 'app/views/**/*.*',
    dist: 'public/views/'
  }
};

gulp.task('copy-html-views', task_Copy_html_views);
function task_Copy_html_views() {
  return gulp.src([routeSources.html_views.path])
      .pipe(gulpFlatten({ includeParents: 1 }))
      .pipe(gulp.dest(routeSources.html_views.dist));
}

在那里你可以看到关于 gulp-flatten 的文档：Link

【讨论】：

【解决方案3】：

   gulp.task('move-css',function(){
      return gulp
                  .src([ 'source/**'], { base: './' })
                  .pipe(gulp.dest('./public/assets/css/'));
    });

调用gulp.src 时，您自己的代码没有包含源代码'source/**' 的整个目录树和基础{base:'./'}，导致函数失败。其他部分还好。

gulp.task('move-css',function(){
  return gulp.src([
    './source/css/one.css',
    './source/other/css/two.css'

    ]).pipe(gulp.dest('./public/assets/css/'));
});

【讨论】：

SO 对仅代码答案不满意。为了长期价值，帮助未来的访问者学习并将这些知识应用于他们自己的问题，并增加投票的机会，请考虑在您的答案中添加解释，突出显示您回答的宠物，以解决 OP 的问题。