在缩小的角度javascript中调试未知提供程序

Dar*_*ght 52 javascript angularjs

我很难确定我的角度应用程序中有哪些方法会导致错误:

Uncaught Error: [$injector:unpr] Unknown provider: nProvider <- n

这只有在ASP.Net捆绑和缩小javascript后才会发生.

我确保所有控制器和任何其他DI都使用缩小安全方法,IE我的控制器/服务等正在使用该方法:

appControllers.controller('myCtrl', ['$scope', function($scope){
        //......
}]);
Run Code Online (Sandbox Code Playgroud)

我已经浏览了我们应用程序中的每个JS文件 - 有很多......并且找不到任何违反这种注入依赖关系的方法 - 尽管必须有一个...

有没有更好的方法来确定哪种方法可能导致此错误?

谢谢

you*_*end 101

对于任何正在努力解决这个问题的人来说,我找到了一个更简单的解 如果您拉开开发人员控制台(在chrome上)并添加一个断点,其中angular会抛出错误:

角投掷错误

然后,在右侧的堆栈跟踪上,单击您看到的第一个"调用".这将带您进入invoke函数,其中第一个参数是angular试图注入的函数:

我能够检查这个功能

然后我在我的代码中搜索了一个看起来像那个(在这种情况下grep "\.onload" -R public)的函数,并找到了8个要检查的位置.

我希望这有帮助!

  • 这应该是答案!通过代码库节省了我几个小时,这本来是徒劳的,考虑到我们在哪里犯了错误.非常感谢! (6认同)
  • 您的示例在未缩小的javascript中添加断点.OP在缩小js时遇到问题.如果错误仅在缩小后发生,这将如何解决问题? (4认同)
  • 这应该是公认的答案.它变得更好:当你将鼠标悬停在`fn`上并看到带有该功能的弹出窗口时,你可以单击该功能,然后你将直接进入相关功能.(不要忘记使用Chome自动格式化您的缩小代码以获得更好的概述!) (2认同)

Max*_*lze 55

对于阅读此内容的任何人,使用Angular 1.3

您现在可以使用Angular的ng-strict-di检查,如下所示:

<div ng-app="some-angular-app" ng-strict-di>
  ...
</div>
Run Code Online (Sandbox Code Playgroud)

如果您未使用数组语法加载依赖项,这将为您提供相应的错误消息.

  • @Neil你可以在bootstrap函数`{strictDi:true}`中的options参数中传递它,如[here](https://docs.angularjs.org/guide/di)所述_Ising Strict Dependency Injection_ (5认同)
  • https://docs.angularjs.org/error/$injector/strictdi?p0=controller错误消息不是我所期望的那么明确:它不能告诉哪个控制器有故障。:-/基本上,它仅确认我们将在缩小模式下遇到问题... (2认同)

小智 8

我遇到了同样的问题,我找到了一个可能对其他人有帮助的解决方案.我的建议基本上就是我在评论和文档中看到的内容.如果您使用的是Angular 1.3.0或更高版本,则可以使用:

<html ng-app="myApp" ng-strict-di>
   <body>
      I can add: {{ 1 + 2 }}.
      <script src="angular.js"></script>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

在我的情况下,我拥有app.js文件中的所有内容,所以我唯一需要做的就是找到我的DI问题是在最后添加这个小代码:

angular.bootstrap(document, ['myApp'], {
  strictDi: true
});
Run Code Online (Sandbox Code Playgroud)

Angular Docs中有更好的文档记录

我希望有所帮助.祝好运!


Dar*_*ght 4

正如评论中提到的,这些是我尝试查找 JS 错误所采取的步骤。

如果有其他更简单的解决方案,请随时发布,我可能会将其标记为已接受。


尝试调试精简代码是一场噩梦。

我最终所做的是直接从 Chrome 中的检查器复制我的缩小版 JavaScript。

然后我将 JS 粘贴到http://www.jspretty.com/ - 我尝试过http://jsbeautifier.org/但发现他们的网站因如此大的 JS 代码而冻结。

一旦它变得“漂亮”,我在我的解决方案中创建了一个 test.js 文件,并将现在更容易阅读的代码粘贴到其中。

快速注释掉@scriptmy 中的标签_layout并添加指向 test.js 文件的链接,我就准备好调试现在更容易阅读的 Javascript 块了。

遍历调用堆栈仍然相当尴尬,尽管现在您可以看到实际的方法,这使得它不再那么不可能。