使用gulp、Browserify、reactify、UglifyJS的源地图

我正在尝试为使用Chrome的JavaScript文件获取源映射。当前gulp脚本的问题是源映射（Browserify创建）会导致文件的缩小版本

例如，假设app.jsx是Browserify的一个条目文件，其中包含

require（'a'）

和

require（'b'）

调用。app.jsx会像预期的那样被浏览、反应、丑化并写入app.js。但是，模块

a

和模块

b

中的所有源地图参考也都缩小了：

var gulp=require（'gulp'），
browserify=require（'browserify'），
watchify=require（'watchify'），
source=require（‘乙烯基源流’），
缓冲区=需要（“乙烯基缓冲区”），
捆扎机；
bundler=browserify({
条目：'/app.jsx'，
缓存：{}，
packageCache:{}，
完整路径：正确
});
捆扎机
.transform（“reactify”）；
.变换({
全球：真的
}"丑化",；
bundler=watchify（bundler）；
bundler.on（'update'，function（）{
回程打包机
.bundle（）
.pipe（源（'app.js'））
.pipe（缓冲区（））
.pipe（大口目的地（'/js'））；
});

---

有什么办法让它工作吗？

看起来这是uglifyify（）的问题。似乎它只是不知道如何生成源地图

有一些替代方案：

与插件和插件捆绑后的丑陋。不幸的是，这稍微不太理想，因为它不会删除死

require

语句

创建单独的开发和分发版本。然后，您可以为您的开发构建生成源映射，而无需进行uglification。如果没有源地图，您的分发版本可能会变得丑陋

---

1的问题。is browserify将sourcemap内联到文件中，然后uglify删除注释。我选择了2，我不喜欢它，因为你没有不断地测试代码在生产中的运行方式，但在我的经验中，这类错误很少发生。你需要告诉gulp sourcemaps阅读现有的地图

sourcemaps.init（{loadMaps:true}）

Ah我认为这对内联源代码映射不起作用，但在阅读文档后，您肯定是正确的。然而，我仍然希望使用更优化的小型化策略进行部署，这意味着我将拥有不同的开发流程。可能会坚持单独构建的策略。不过非常感谢你的建议。