如何让 Bower、ASP.Net 5 安装 GULP bundel 库

Question

我已经使用新的 Bower 系统在我的 ASP.Net 5 应用程序中安装了 jQuery 和 jQuery-Validation。这创建了一个名为 lib 的文件夹，其中包含两个包的文件夹。在包的文件夹中有很多文件和子文件夹，经过一番挖掘，看起来我只需要使用dist 文件夹中的.js 文件。

我还使用gulp 进行捆绑和缩小，但我不确定如何配置它，因此它将添加来自dist 文件夹的文件以及我自己的自定义JavaScript 文件。

我对 Gulp 和 Bower 都很陌生，但到目前为止，它们看起来比旧的 NuGet 和 ASP.Net 2.5 捆绑和缩小方式更麻烦、烦人和复杂。

我的 Gulp（由 VS2015 为我生成）： /// “使用严格”；

var gulp = require("gulp"),
    rimraf = require("rimraf"),
    concat = require("gulp-concat"),
    cssmin = require("gulp-cssmin"),
    uglify = require("gulp-uglify");

var paths = {
    webroot: "./wwwroot/"
};

paths.js = paths.webroot + "js/**/*.js";
paths.minJs = paths.webroot + "js/**/*.min.js";
paths.css = paths.webroot + "css/**/*.css";
paths.minCss = paths.webroot + "css/**/*.min.css";
paths.concatJsDest = paths.webroot + "js/site.min.js";
paths.concatCssDest = paths.webroot + "css/site.min.css";

gulp.task("clean:js", function (cb) {
    rimraf(paths.concatJsDest, cb);
});

gulp.task("clean:css", function (cb) {
    rimraf(paths.concatCssDest, cb);
});

gulp.task("clean", ["clean:js", "clean:css"]);

gulp.task("min:js", function () {
    return gulp.src([paths.js, "!" + paths.minJs], { base: "." })
        .pipe(concat(paths.concatJsDest))
        .pipe(uglify())
        .pipe(gulp.dest("."));
});

gulp.task("min:css", function () {
    return gulp.src([paths.css, "!" + paths.minCss])
        .pipe(concat(paths.concatCssDest))
        .pipe(cssmin())
        .pipe(gulp.dest("."));
});

gulp.task("min", ["min:js", "min:css"]);

编辑： 我刚刚添加了jquery.validatie.unobtrusive，它没有dist 文件夹，只有一些json 文件和核心.js 文件位于包根目录，所以我如何确保我在这里抓取了所有正确的东西？

Answer 1

假设你的 dist 文件夹在 webroot 下：

paths.dist = paths.webroot + "dist/**/*.js";
..
gulp.task("min:js", function () {
return gulp.src([paths.js, paths.dist, "!" + paths.minJs], { base: "." })

关键是您设置 gulp 从中提取文件的源文件夹。请注意，我将我的 paths.dist 添加到了数组中？这会将那个文件夹和它下面的所有 js 文件添加到 gulp 中。如果您需要另一个文件夹，请将另一个属性添加到路径并将其添加到数组中。