javascript - 您可以使用 gulp 根据文件的父文件夹将文件连接在一起吗？

Question

我正在尝试建立一个通用框架供我用于多个项目。我主要尝试这样做是为了获得 gulp/npm 和构建项目的经验。

我想将所有不同的组件分开，并使用 gulp 任务将每个组件文件夹文件编译在一起

具体来说，例如...

我想使用这些 glob

app/components/**/scripts/**/*.js
app/components/**/*.css

使用这些文件

app/components/about/file1.css
app/components/about/file2.css
app/components/about/scripts/file1.js
app/components/about/scripts/file1.js
app/components/home/file1.css
app/components/home/file2.css
app/components/home/scripts/file1.js
app/components/home/scripts/file1.js

我想将它们合并到这些文件中

app/components/about/scripts.js
app/components/home/scripts.js
app/assets/css/components/about_styles.css
app/assets/css/components/home_styles.css

我找到了this recipe看起来它符合我的要求，但看起来很笨重。

这可以用 gulp 实现吗？如果没有，是否有一些模块可以用来通过 gulp 来执行此操作？

Answer 1

听起来您想使用 gulp-concat

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

gulp.task('aboutScripts', function() {
  return gulp.src('./app/components/about/scripts/*.js')
    .pipe(concat('scripts.js'))
    .pipe(gulp.dest('./app/components/about/'));
});

gulp.task('homeScripts', function() {
  return gulp.src('./app/components/home/scripts/*.js')
    .pipe(concat('scripts.js'))
    .pipe(gulp.dest('./app/components/home/'));
});

等等

也可能 gulp-concat-css