基于 MVC 区域的 Concat 文件

Concat files based on MVC Area

本文关键字：Concat 文件 区域 MVC 基于      更新时间：2023-09-26

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

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

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

例如 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'])

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

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

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

我使用带有不同视图文件夹名称的gulp.src来收集单个视图文件夹中的所有Javascript文件，然后将它们连接起来，最后，如果它是一个发布版本，文件就会被ugilfied。

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;
}
相关文章：