使用Ruby on Rails,Webpack和React JS在Chrome中将源地图缩小一行


96

我遇到一个问题,inline-source-map当我使用Chrome devtools调试器时,使用配置设置由Webpack生成的源地图关闭了一行。Webpack是在Ruby on Rails应用程序中设置的,以生成由几十个模块组成的串联的,最小化的JavaScript文件。这些模块中的大多数是ReactJS组件,由jsx加载器进行解析。然后,Webpack的输出application.js与gems生成的其他一些JavaScript库一起包含在文件中。

当我使用时eval-source-map,没有问题。关于使用use的某些事情inline-source-map会使行号被一甩掉。

检查不是React组件的JavaScript仍然存在此问题,因此我认为它与jsx的使用无关。


4
听起来好像一侧认为第一条线是line 0,另一侧则认为它是line 1。您可能只需要选择一个定义,然后为另一种可行的方法调整值即可。
卡尔·史密斯

3
如果有一种方法可以调整浏览器在源映射中用于行号的值,则可以潜在地解决问题。从那时起,我也做了一些试验,似乎当使用不带链轮的Rails处理webpack生成的JS时,问题就消失了。仅当同时使用webpack和链轮时,行号才关闭。
paradasia 2014年

1
我不知道。我在Mozilla的源地图JS库中使用CoffeeScript的源地图。一切都只是将微细column下面的代码中的arg 1传递太高:window.onerror = function(message, url, line, column){}。减少它可以解决该问题。注意:特定于Chrome,我不了解其他浏览器。
卡尔·史密斯

2
似乎相关:github.com/plumberjs/plumber-requirejs/commit/…从而解决了require.js的问题
justingordon 2014年

1
可能是您在过程中某处添加了标题行,例如版权声明吗?
rogierschouten

Answers:


3

chrome中存在一个错误,请尝试使用最新版本,也请在您的webpack配置上尝试在devtool上使用不同的sourcemaps,并尝试所有这些命令以查看是否适用于内联源地图:

  • 内联源映射

  • Cheap-inline-source-map

对于其他不同的配置:

  • 便宜的源地图

  • 廉价模块源地图

  • 廉价模块评估源地图

在webpack配置上:

{

...

devtool:'source-map'

...

}
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.