Question

我们有一个ASP.NET 3.5（IIS应用程序池2.0）webSite。我们正在 Windows8.1 中使用 Visual Studio 2013 update4进行开发。
问题是：当我缩小JavaScript文件（使用 Web Essentials 扩展名）并更改aspx文件以使用新创建的 min.js 文件时， Visual Studio 或任何其他浏览器无法正常工作。我们希望我们处理原始的 js 文件（放置断点等等），然后Web浏览器运行它的缩小 min.js 文件（从那时起）关系存在于 map 文件中），但在Visual Studio中，我的断点变成空心的黄色圆圈（使用工具提示：断点当前不会被击中。没有符号... ... < / em>）即使我按下Ctrl + F5刷新页面并且在 Chrome 中进行调试时，会出现许多奇怪的问题：变量值无法读取，断点不能正确点击地方和。。。
到目前为止，我尝试清理，重建Visual Studio中的Web项目，重置Internet Explorer和Chrome设置以及更新Visual Studio和Web Essentials扩展，并使用新版本再次缩小JavaScript文件。

Answer 1

进一步对此问题的答案进行进一步阐述：https://stackoverflow.com/a/27117035/19594

一个简单的sourcemaps文件如下所示：

{
    version : 3,
    file : "someFile.js",
    sourceRoot : "/",
    sources : ["some/relative/path/someFile.ts"],
    names : ["bla", "bla", "bla"],
    mappings: "aaaG,agAA,agGG,acAA"
}

如果sources或sourceRoot的值是相对路径（如上例所示），则Visual Studio将不知道要连接的源文件。

您需要将sources或sourceRoot设置为指向绝对路径。您可以通过以下几种方式之一来完成此任务：

手动编辑.js.map文件以反映绝对路径。像这样：

{
    version : 3,
    file : "someFile.js",
    sourceRoot : "c:\my-absolute-root-path/",
    sources : ["some/relative/path/someFile.ts"],
    names : ["bla", "bla", "bla"],
    mappings: "aaaG,agAA,agGG,acAA"
}

或者设置sourcemap生成器以发出完整路径。我像这样使用了gulp和gulp-sourcemaps：

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

var srcFiles = ["**/*.js"];
var distPath = "dist/";

gulp.task("default", function () {
    return gulp.src(jsSrcFiles)
        .pipe(sourcemaps.init())
        .pipe(concat("app.js"))
        .pipe(uglify())
        .pipe(rename("app.min.js"))
        .pipe(sourcemaps.write(".", { includeContent: false, sourceRoot: "C:\my-absolute-root-path" }))
        .pipe(gulp.dest(distPath));
});

使用源映射在Visual Studio中调试缩小的JavaScript

1 个答案: