如何在browserify

Question

我使用browserify进行新项目。到目前为止它确实很好用。

我有一个大问题。如何单独调试每个js文件。它将所有文件捆绑在一起，如果发生错误则指向捆绑。

我正在使用chrome和源地图，但它在调试方面并没有多大帮助。

有什么想法吗？

更新：更多信息：

我在package.json

中使用此命令

"start": "watchify scripts/main.js -o scripts/bundle.js --debug",

并获得如上所示的错误，这是不理想的。

我相信我的源地图已经开启了吗？

Answer 1

我不确定您在没有任何代码的情况下如何使用命令行工具进行浏览，但您应该可以使用debug。

  

- debug -d启用允许您调试文件的源映射                          分开。

browserify main.js -o bundle.js --debug

有关CLI工具的更多信息，请查看此处 - https://github.com/substack/node-browserify#usage

编辑经过多一点挖掘 - 此处特别受到关注的问题是ParseError - 这意味着Browserify实际上从未进入正确的调试阶段。没有真正想过，但这完全有道理。

为了测试这个 - 我创建了两个简单的文件：

a.js

module.exports = function(a) {
    return a;
}

main.js

var a = require('./a.js');
console.log(a("something"));

然后我使用browserify使用watchify脚本运行npm：

"start": "watchify main.js -o bundle.js --debug"

在浏览器中使用该脚本，一切运行良好 - 它按预期登录到控制台。然后我用错字编辑a.js：

a.js

module.exports = function(a) {
    return a---
}

浏览器 和 watchify 引发了上面显示的错误：path/to/file/a.js:3 ParseError: Unexpected Token。

Browserify无法正确编译文件，因此它会抛出错误。您应该在构建期间在控制台中看到这一点。

为了测试--debug标志是否按预期工作，我再次修改了代码：

a.js

module.exports = function(a) {
    return a('something');
}

此处的期望值为TypeError，因为函数现在期望a是一个函数。

浏览器中的控制台现在显示：     Uncaught TypeError: a is not a function __________ a.js:2

修复您的解析问题，browserify --debug将再次开始按预期运行。