javascript - 基于MVC Area的Concat文件

Question

我正在构建一个使用区域的 MVC 应用程序。所以我的文件夹结构如下:

Areas/
  AreaOne/
    Views/
      About/
        ScriptOne.js
        ScriptTwo.js
        Index.cshtml
      Home/
        ScriptThree.js
        ScriptFour.js
        Index.cshtml
  AreaTwo
    Views/...

我想将 JavaScript 文件捆绑到 View 文件夹内的各个页面的文件夹中。

例如ScriptOne.js、ScriptTwo.js 应捆绑到 About.js 中并输出到单独的文件夹中，例如:

js/
  Areas/
    AreaOne/
      About.js
      Home.js

我能够抓取文件，但是它将抓取区域下的所有 .js 文件。

gulp.src('./Areas/**/*.js')

Areas\AreaOne\Views\About\ScriptOne.js
Areas\AreaOne\Views\About\ScriptTwo.js
Areas\AreaOne\Views\Home\ScriptThree.js
Areas\AreaOne\Views\Home\ScriptFour.js

如果我将其连接起来，我最终会得到一个 .js 文件。不过我想要 About.js 和 Home.js

如果我理论上可以实现上述目标，我可以使用以下内容(但我不确定如何获取适当的区域名称:

pipe(gulp.dest('./js/Areas/...AREA NAME GOES HERE.../'))     

我试图避免手动连接文件..就像这样..

gulp.src(['./Areas/AreaOne/Views/About/ScriptOne.js', './Areas/AreaOne/Views/About/ScriptTwo.js'])

Answer 1

不确定这是最简洁的方法，但它有效并且相当简单。

我使用 Glob 来获取区域内的文件名。

然后，我将 View 路径添加到 JavaScript 对象(这就像一个集合，它可以防止重复)，我还添加 View 文件夹的名称，因为这将是输出文件名。

我使用 gulp.src 和不同的 View 文件夹名称来收集各个 View 文件夹中的所有 Javascript 文件，然后将它们连接起来，最后，如果它是发布版本，则文件会被丑化。

var gulp = require('gulp'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify'),
    glob = require('glob'),
    path = require('path');

gulp.task('process-areas-js', function () {

    glob('./Areas/**/*.js*', null, function (er, files) {
        var distinctAreaPaths = {};

        for (var i = 0; i < files.length; i++) {

            var filePath = path.dirname(files[i]).replace(/\./g, "");
            var viewFolderName = path.basename(filePath);

            distinctAreaPaths[filePath] = viewFolderName;
        }

        for (distinctPath in distinctAreaPaths) {            
            var concatName = distinctAreaPaths[distinctPath] + ".js";
            var destination = './js' + path.dirname(distinctPath);
            var sourceGlob = "." + distinctPath + "/*.js";

            var pipeline = gulp.src(sourceGlob)
                .pipe(concat(concatName))

            uglifyOnRelease(pipeline)
                .pipe(gulp.dest(destination));                            
        }
    });    
});

gulp.task('default', ['process-areas-js']);

function uglifyOnRelease(pipeline) {
    return process.env.NODE_ENV === 'Release' || process.env.NODE_ENV == null ? pipeline.pipe(uglify()) : pipeline;
}