Question

我正在构建一个使用Area的MVC应用程序。所以我有一个文件夹结构如下：

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

我想将JavaScript文件捆绑在View文件夹中的单个页面文件夹中。

E.g。 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来获取区域内的文件名。

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

我使用gulp.src和不同的视图文件夹名称来收集单个视图文件夹中的所有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;
}

基于MVC区域的Concat文件

1 个答案: