Browserify + Minifyify 与非缩小源地图

Question

所以我使用 Browserify 和 Minifyify 来捆绑一些 JS 源代码，并生成源映射。

Minifyify 声称指向原始源文件，但是当我在 Chrome 中查看源映射时，我看到的是原始文件的缩小版本。并且控制台错误中的任何堆栈跟踪始终显示第 1 行，因为所有代码都在一行中。

这是 Minifyify 的预期行为吗？如果不是，我还需要做些什么来获取原始源的源映射吗？

我的设置如下所示：

var hbsfy = require("hbsfy").configure({
  extensions: ["html"]
});

var fs = require('fs');

var opts = { debug: true };

var browserify = require("browserify");

var scriptFile = './app.js';
var outputFile = './build/app.min.js';
var mapFile = 'app.min.map';
var mapOutput = './build/app.min.map';


var b = new browserify(opts);
b.add(scriptFile);
b.transform(hbsfy);
b.plugin('minifyify', { map: mapFile, output: mapOutput });
b.bundle().pipe(fs.createWriteStream(outputFile));

Answer 1

所以我发现了问题所在。这是 Windows 上 Minifyify 中与不同路径分隔符相关的错误。一个快速的解决方法是编辑 minifier.js 文件并将这一行添加到 Minifier.prototype.transformer 的顶部：

file = file.replace(new RegExp('\\' + path.sep, 'g'), '/');

为了将来的参考，这个错误出现在 v4.0.3 中，很可能是所有以前的版本。我已将信息提交给作者，因此希望在下一个版本中得到修复。

Answer 2

我只用过 cli。

但是查看文档，您的最后一行似乎是问题所在。

尝试：

b.bundle(function (err, src, map) {
  if (err) {
    throw err;
  }
  fs.writeFile(outputFile, src);
  fs.writeFile(mapOutput, map);
});

你也不需要调试：true

Answer 3

这是问题所在：https://github.com/substack/node-browserify/commit/dddc29673186c1dfe3f99d2af5bef02c51df12f0

我能看到的最简单的解决方法是使用 6.0.0 之前的最后一个版本的 browserify，直到更正 minifyify（和 uglify）以解决此更改。