如何使源地图在使用webpack和angular5的jhipster应用程序的chrome中工作？

Question

我已经生成了一个JHipster Gateway项目，它是一个带有Angular5前端的Java Spring应用程序。 JHipster使用WebPack配置Angular应用程序。

我在调试调试以使用Angular应用程序时遇到麻烦。 我有一段时间没有这样做了，所以这可能是菜鸟的错误，因此我正在寻找可以得到的任何帮助。

开发环境的WebPack配置文件中有一行用于配置源映射，其中包含以下内容：

module.exports = webpackMerge(commonConfig({ env: ENV }), {
devtool: 'eval-source-map',

据我了解，我应该在“源”选项卡中看到webpack：//，但没有看到。

任何人都可以向我指出正确的方向，这可能是WebPack问题，而不是jhipster问题。

还有其他我需要做的事情来调试chrome中的打字稿吗？

非常感谢你的帮助！

Answer 1

糟糕...我的糟糕...太尴尬了。

我没有意识到Webpack构建失败，因为我更改了节点版本，并且需要重新安装节点模块才能使sass处理器正确构建。 看起来SASS处理在Webpack构建中失败了，我猜这是在生成源映射之前发生的。

解决问题后，我确实在chrome的“源”选项卡中看到了源映射和webpack：//。

对于那个很抱歉