javascript - 如何在 Visual Studio 2015 中进行捆绑和缩小

Question

Visual Studio 2013 附带的 APS.NET MVC 项目模板使用捆绑将 CSS 和脚本文件发送到浏览器。

Visual Studio 2015自带的ASP.NET MVC项目模板已经停止使用，插入<link rel='stylesheet' ... >直接声明。

推荐的捆绑和缩小最佳实践是什么？

Answer 1

有一篇关于此的文章 - Where Did My ASP.NET Bundles Go in ASP.NET 5?和 What about Bundling and Minification .

从 ASP.NET 5 开始，Microsoft 鼓励开发人员开始集成一些其他 Web 开发人员一直在使用的更流行的 Web 开发工具:Gulp、npm 和 bower。这些工具中的每一个都有特定的用途:

• Gulp 是一个用 JavaScript 编写的运行于 NodeJS 框架并自动执行重复性任务
• npm 是节点包管理器，可用于交付 在 NodeJS 框架中运行的插件和实用程序。
• Bower 是一个包管理器，用于从 Git 交付静态资源 存储库。

这些工具现在允许您捆绑和缩小您的脚本和 css:

• gulp-concat连接文件
• gulp-uglify使用 UglifyJS 压缩文件
• gulp-less编译你的 less 文件
• gulp-cssmin使用 gulp 压缩 CSS
• gulp-rename轻松重命名文件的 gulp 插件

都可以通过npm安装。

例子:

var paths = {
    bower: "./bower_components/",
    lib: "./" + project.webroot + "/lib/",
    app: "./" + project.webroot + "/app/",
    dist: "./" + project.webroot + "/dist/"
};

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

gulp.task("bundle", function () {
    return gulp.src([
        paths.app + "menu.js",
        paths.app + "app.js"])
    .pipe(concat("all.js"))
    .pipe(gulp.dest(paths.dist))
    .pipe(rename("all.min.js"))
    .pipe(uglify())
    .pipe(gulp.dest(paths.dist));
});