“未捕获的错误:[$injector:unpr]"部署后有角度 [英] "Uncaught Error: [$injector:unpr]" with angular after deployment

问题描述

我有一个相当简单的 Angular 应用程序，它在我的开发机器上运行得很好，但在我部署它后失败并显示此错误消息(在浏览器控制台中):

I have a fairly simple Angular application that runs just fine on my dev machine, but is failing with this error message (in the browser console) after I deploy it:

未捕获的错误:[$injector:unpr] http://errors.angularjs.org/undefined/$injector/unpr?p0=tProvider%20%3C-%20t%20%3C-%20%24http%20%3C-%20%24编译

除此之外没有其他消息.它发生在页面第一次加载时.

No other message besides that. It happens when the page first loads.

我正在运行 ASP.NET MVC5、Angular 1.2RC3，并通过 git 推送到 Azure.

I'm running ASP.NET MVC5, Angular 1.2RC3, and pushing to Azure via git.

谷歌搜索没有发现任何有趣的东西.

Googling hasn't turned up anything interesting.

有什么建议吗?

我正在使用 TypeScript，并使用 $inject 变量定义我的依赖项，例如:

I'm using TypeScript, and defining my dependencies with the $inject variable, e.g.:

export class DashboardCtrl {

    public static $inject = [
        '$scope',
        '$location',
        'dashboardStorage'
    ];

    constructor(
        private $scope: IDashboardScope,
        private $location: ng.ILocationService,
        private storage: IDashboardStorage) {
    }
}

我认为应该(或打算)解决在缩小过程中出现并可能导致此错误的局部变量重命名问题.

I believe that should (or is intended to) get around the local variable renaming problems that arise during minification and that can cause this error.

也就是说，它显然与缩小过程有关，因为当我在我的开发机器上设置 BundleTable.EnableOptimizations = true 时，我可以重现它.

That said, it clearly has something to do with the minification process, as when I set BundleTable.EnableOptimizations = true on my dev machine, I can reproduce it.

推荐答案

如果您点击链接，它会告诉您错误是由 $injector 无法解决您的依赖项造成的.这是 angular 的一个常见问题，当 javascript 被缩小/丑化/无论您为生产做什么时.

If you follow your link, it tells you that the error results from the $injector not being able to resolve your dependencies. This is a common issue with angular when the javascript gets minified/uglified/whatever you're doing to it for production.

问题是当你有例如一个控制器；

The issue is when you have e.g. a controller;

angular.module("MyApp").controller("MyCtrl", function($scope, $q) {
  // your code
})

缩小将 $scope 和 $q 更改为不告诉 angular 注入什么的随机变量.解决方案是像这样声明您的依赖项:

The minification changes $scope and $q into random variables that doesn't tell angular what to inject. The solution is to declare your dependencies like this:

angular.module("MyApp")
  .controller("MyCtrl", ["$scope", "$q", function($scope, $q) {
  // your code
}])

那应该可以解决您的问题.

That should fix your problem.

再次重申，我所说的一切都在错误消息提供给您的链接中.

Just to re-iterate, everything I've said is at the link the error message provides to you.

这篇关于“未捕获的错误:[$injector:unpr]"部署后有角度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！