Chrome 断点不适用于 browserify 和 babelify

Question

我正在尝试在 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)));

Answer 1

我找到了解决方案。是因为脚本引用的版本查询。

转

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

至

/build/layoutModuleScripts/root/root.js

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

Chrome 断点不适用于 browserify 和 babelify

Chrome breakpoints does not work with browserify and babelify

google-chrome

browserify

babelify