Gulp js src :首先获取最深的文件

Gulp js src : get deepest files first

本文关键字:文件 获取 js src Gulp      更新时间:2023-09-26

我使用 Gulp 基于 React 框架构建了一个小型 Web 应用程序。

要编译客户端脚本,我的任务是这样开始的:

gulp.task( 'buildClientScripts', function () {
    // Get all the js and jsx scripts
    // Starts with the app.js file
    return gulp.src( [
            'app/app.js',
            'app/clientScripts/**/*.jsx',
            'app/clientScripts/**/*.js',
        ] )

文件的顺序是我的问题。对于此文件结构:

- clientScripts
---- components
-------- subComponents
------------ mysubComponent.js
-------- myComponent.js
---- main.js

加载顺序为:main.jsmyComponent.jsmysubComponent.js。但显然,我的顶级文件需要更深的文件才能工作。

如何要求 gulp 先加载最深的文件?

您可以使用

gulp-sort在gulp.src读取文件后对文件进行排序。

计算路径中的斜杠作为确定深度的粗略方法。

var sort = require('gulp-sort');
var path = require('path');
gulp.task( 'buildClientScripts', function () {
    // Get all the js and jsx scripts
    // Starts with the app.js file
    return gulp.src( [
        'app/app.js',
        'app/clientScripts/**/*.jsx',
        'app/clientScripts/**/*.js',
    ] )
    .pipe(sort(function(file1, file2) {
      return countSlashes(file2) - countSlashes(file1);
      function countSlashes(file) {
        return file.path.split(path.sep).length - 1;
      }
    })