Chrome断点不适用于browserify和babelify

编程问答 2022-06-10

问题描述

我正在尝试在chrome上调试我的应用。我以前使用过打字稿，并且工作正常。但是，当我使用browserify和babelify切换到javascript时，不再触发断点。我可以看到原始文件源。我可以设置断点。但这并不止于此。我也尝试将断点放在已编译的文件上，但这也不起作用。我尝试在Microsoft Edge上也无法正常工作。这是我用来编译JavaScript的代码。顺带一提，debugger;可以正常工作。但是我不想这样做，因为我忘了删除它们。

browserify({
   entries: inputPath,debug: !prodMode // prodMode is false so debug is true
})
   .transform("babelify",{ presets: ["@babel/preset-env"] })
   .bundle()
   .pipe(vinylSourceStream(path.basename(outputPath)))
   .pipe(gulp.dest(path.dirname(outputPath)));

解决方法

我找到了解决方案。这是因为脚本参考上的版本查询。

转身

/build/layoutModuleScripts/root/root.js?v=1601795818927

到

/build/layoutModuleScripts/root/root.js

现在断点起作用了。我不知道与babel或browserify有什么关系。但是在打字稿中，它正在处理查询字符串。

babelifybrowserifybrowserifybrowserifygoogle-chrome