ASP.Net Core 2.1: как использовать Gulp с npm для зависимости проекта - PullRequest
Новая
       9

ASP.Net Core 2.1: как использовать Gulp с npm для зависимости проекта

0 голосов
/ 26 июня 2018

Теперь, когда Bower не работает с ASP.Net Core 2.0, мне нужно найти столь же эффективный способ минимизации / внедрения моих зависимостей из npm.

Я установил gulp и, используя npm, обновляю все свои зависимости в папку node_modules в корне моего проекта. Следующим шагом будет получение всех зависимостей, перечисленных в моем файле package.json, для вставки в папку wwwroot моего проекта.

Я шел по учебному пособию Шона Вильдермута: https://wildermuth.com/2017/11/19/ASP-NET-Core-2-0-and-the-End-of-Bower и его " Лучшее решение " требует, чтобы каталоги зависимостей были перечислены в файле Gulp: 

// Dependency Dirs
var deps = {
    "jquery": {
        "dist/*": ""
    },
    "bootstrap": {
        "dist/**/*": ""
    },
};

Затем создайте задачу, чтобы перебрать следующие каталоги: 

gulp.task("scripts", function () {
    var streams = [];

    for (var prop in deps) {
        console.log("Prepping Scripts for: " + prop);
        for (var itemProp in deps[prop]) {
            streams.push(gulp.src("node_modules/" + prop + "/" + itemProp)
                .pipe(gulp.dest("wwwroot/vendor/" + prop + "/" + deps[prop][itemProp])));
        }
    }

    return merge(streams);
});

Можно ли это сделать без перечисления всех каталогов зависимостей в файле Gulp? И вместо этого отсканируйте файл package.json, чтобы перенести определенные файлы из папки node_modules в wwwroot

Вот мой package.json: 

{
    "version": "1.0.0",
    "name": "asp.net",
    "dependencies": {
        "jquery": "3.3.1",
        "bootstrap": "4.1.1"
    },
    "devDependencies": {
        "gulp": "3.9.1",
        "gulp-concat": "2.6.1",
        "gulp-cssmin": "0.1.7",
        "gulp-uglify": "2.0.1",
        "rimraf": "2.6.1"
    }
}

А вот и остальные мои gulpfile.js: 

/// <binding BeforeBuild='clean, min, scripts' Clean='clean' />
"use strict";

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"]);

Я видел некоторые решения, которые просто берут все из папки node_modules, но это будет гигантская (ненужная) загрузка на сервер, чего я бы не делал.

Любая помощь?

...