UglifyJS2中断Angular.js应用程序中的依赖注入

Question

我有一个Angular.js应用程序，我想缩小它。

首先，我设置了一个特定的gulp管道，以便自动处理注释和细化。

为了检查隐式注释的工作效果，我使用ngAnnotate添加了注释，然后使用严迪选项运行应用程序，以捕获所有遗漏的注释。然后，我为我找到的所有缺失注释添加了注释提示。在那之后，一切都很好，ngAnnotate自动注释我的代码，strict-di没有更多的警告。

但是，当我实际使用UglifyJS2缩小代码时，它无法启动应用程序，说明没有找到某些服务。

下面是实际的错误消息：

状态更改错误：$injector:unpr未知提供程序: tProvider <- t

如果我将mangle: false选项添加到UglifyJS2中，它可以正常工作。

-所以问题是，我如何找到罪魁祸首，为什么strict-di没有抓住它？

Answer 1

好吧!我终于解决了这个问题。

我将在这里发布一个策略，帮助我有效地解决这个问题。

策略

我有一个相当大的代码库，所有东西都在一个JavaScript文件中。所有的依赖关系，第三方，以及本地，都在其中声明，并捆绑与吞咽插件。

我做的第一件事是将代码分成两个文件：vendor.js和application.js。我将所有第三方依赖项移到第一个文件中，并将所有本地依赖项保留在第二个文件中。在此之后，我尝试使用application.js minified和vendor.js来运行我的应用程序。这个简单的技巧帮助我确定了这个问题实际上是第三方代码，而不是我的应用程序。

当时我已经指定了34个外部依赖项，因此，我再次创建了两个文件vendor.js和vendor-cleared.js，并开始将依赖项从第一个文件移到第二个文件(减半)。这一次，我已经编译了第二个，并留下了第一个没有缩小。经过几次迭代之后，我发现了一个有问题的第三方库，它没有得到正确的注释。

我已经修复了它，并将所有的东西重新组合在我的application.js中。从那以后，我的应用程序就开始完美无缺地工作了。

我希望这个简单的想法将有助于您将大型代码库转换为一个正确注释的代码库，并最终将其缩小！

在此之后，只需检查在添加新的依赖项时小型化是否正常工作。不要忘记总是使用strict-di。它并不总是起作用，但它做得相当好。