Google chrome 控制台未显示正确、准确的 javascript 行号答案

【问题标题】：Google chrome console is not showing correct, accurate javascript line numberGoogle chrome 控制台未显示正确、准确的 javascript 行号
【发布时间】：2022-10-05 18:28:00
【问题描述】：

我正在使用离子框架开发一个角度项目，使用 ion-router-outlet 所有这些，并尝试使用 google chrome 控制台进行调试。但是，谷歌浏览器控制台没有显示正确的行号，几乎不可能调试。

如您所见，所有错误现在都指向 main.js:1:anyline。我错过了有实际准确错误指示器的旧时代。我该如何解决这个问题？谢谢你。

附加信息。这就是源窗口的样子。

在我向 formatted.main.js 添加断点后也有此错误消息

您的代码已缩小。使用未缩小的开发版本进行调试，或生成和使用源映射。
哦，等一下，我现在可以看到它，因为我点击了重新加载按钮。但后来它变成了 main.js:formatted:0:anyline。仍然无法为我调试。
看我的第一条评论...
不幸的是，原来我的谷歌浏览器已经勾选了启用 javascript 源映射框，它对解决问题没有帮助......
不仅浏览器需要启用源映射。您还应该确保在您的angular.json 文件中启用了sourceMap，并且您实际上使用了正确的构建配置（例如development），您已经为其启用了源映射生成。如果操作正确，您应该能够在“源”选项卡中看到您的打字稿代码，而不是 javascript。

标签： javascript angular typescript google-chrome ionic-framework

【解决方案1】：

我已经修复了这个错误。除了上面评论中的建议，例如谷歌浏览器控制台启用“源映射选项”。记得正确格式化 angular.json 文件例如，我将选项放在生产配置中，如下所示

"configurations": {
  "production": {
     "fileReplacements": [{
       "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.prod.ts"
      }]
   },
   "optimization": false,
   "sourceMap": true,
   "namedChunks": true,
   "extractLicenses": false,
   "vendorChunk": false,
   "buildOptimizer": false
}

所以我的ng serve 命令永远不会生成源映射。我将尝试使用ng serve --configuration production 在生产模式下提供服务。或者干脆把它放在options 里面，production 层外面

抱歉没有提供足够的源代码，以为我的错误要复杂得多。

【讨论】：