如何使用gulp / browsersync或类似的东西观察和任务动态动态列表

Question

我正在运行带有文件监视功能和BrowserSync的gulpfile。

我正在寻找一种方法来动态更改任务的源数组，而无需重新启动所有任务/监视/进程/服务器。我目前使用Gulp进行构建过程，但是具有此功能的任何类似的东西都会很棒。

示例：

gulp.task('scripts', () =>
     gulp.src(['js/file1.js'])
        .pipe(...)
        .pipe(...)
)

更改为

gulp.task('scripts', () =>
     gulp.src(['js/file1.js', 'js/file2.js', 'js/file3.js'])
        .pipe(...)
        .pipe(...)
)

无需重新加载browsersync进程和其他gulp.watch函数。

Answer 1

将您想要动态的所有路径放在文件paths.json中：

{
  "scriptFiles": ["js/file1.js"]
}

在gulpfile.js添加一个读取和解析JSON文件的函数paths()：

var fs = require('fs');

function paths() {
  return JSON.parse(fs.readFileSync('paths.json'));
}

在您的任务中，使用该功能访问您在paths.json中定义的路径：

gulp.task('scripts', () =>
  return gulp.src(paths().scriptFiles)
    .pipe(...)
    .pipe(...)
);

现在您只需编辑"scriptFiles"中paths.json属性的值，下次运行scripts任务时，它将使用更新后的值。