从 browserify 和 uglify 生成 sourcemap答案

【问题标题】：generate sourcemap from browserify and uglify从 browserify 和 uglify 生成 sourcemap
【发布时间】：2015-06-04 01:18:09
【问题描述】：

我想使用 browserify 和 uglify 生成一个带有 sourcemap 的 min js。

我正在使用节点和 npm 脚本。

当我运行“npm run processjs”时，它给了我 bundle.js 和 bundle.js.map。但是当我在chrome中打开应用程序时，chrome只显示代码来自“bundle.js”文件，而不是来自每个模块的原始js文件。

"buildjs": "node node_modules/browserify/bin/cmd.js src/index.js -o src/bundle.js" ,
"uglifyjs": "node_modules/uglify-js/bin/uglifyjs src/bundle.js -o src/bundle.js --source-map src/bundle.js.map -p relative",
"processjs": "npm run buildjs && npm run uglifyjs",

无论如何，源映射实际上映射到每个模块js，而不是单个bundle.js

【问题讨论】：

如果您希望它映射模块而不是捆绑包 - 检查 browserify 中的源映射内容 - 然后源映射将指向原始文件：browserify docs 我相信它是您要生成的调试标志 - 我使用它，它在 chrome 中工作

标签： node.js browserify uglifyjs

【解决方案1】：

所以你想要的是作为 browserify 部分的一部分包含--debug 标志。来自文档：

--debug -d 启用允许您调试文件的源映射分别地。而不是在 uglify 步骤中映射你的包

【讨论】：

谢谢。如果没有应用 uglify，我试过了。应用 uglify 后，chrome 仍未显示原始模块文件。那么，在缩小实际 js 脚本的同时，难道不能让源映射指向源模块文件吗？
尝试查看文档here - 还有一些其他的源映射标志可能会有所帮助