“未知provider"对于依赖声明在提供商$get函数..但只能在简化的代码中

"unknown provider" for dependency declared on provider $get function... but only in minified code

本文关键字:函数 get 提供商 代码 声明 quot provider 未知 于依赖 依赖      更新时间:2023-09-26

我有一个angular(1.4.3)应用和一个gulp管道,它使用ngAnnotate和uglify来最小化它。

我有一个服务的提供者,它有一个函数,打开一个(ui.bootstrap)模式:

angular.module('myapp', ['ui.bootstrap'])
   .provider('AuthUser', function(){  
        return {
            //stuff
            $get: function($q, MyConstant, $modal){ 
                  return {
                      showLoginModal : showLoginModal
                  }
                 function showLoginModal() { 
                    $modal.open({ 
                         templateUrl: '/path/to.html'
                         //stuff
                     });
                 }
            }
        }
    }

这在开发模式(非最小化)下工作得很好,最小化的代码在节点开发服务器上运行时,在我的本地(Windows)机器上运行得很好。但是当我将代码拉入我的AWS (ubuntu)实例gulp build并静态地提供服务时,我在$injector:unpr: Unknown provider: Provider <-上崩溃了

错误消息本身(以及我给出的相应的错误引用链接)并没有告诉我缺少哪个提供者,它们只是有一个空白。在跟踪之后,我可以看到它发生在对$modal.open()的调用上,因此假设缺失的依赖项是$modal,但无法找出原因。

MyConstant被注入并在服务的其他地方使用而没有问题,所以我认为这不是最小化问题,但是为了记录,这里是如何最小化的:

angular.module("civ.core").provider("AuthUser", function() {
    var e = this;
    return e.token = null ,
    e.user = null ,
    {
        initialize: function(t) {
            e.token = t.token,
            e.user = t.user
        },
        $get: ["$http", "$q", "$localStorage", "$modal", "DEVELOPMENT", "PRODUCTION", function(t, i, n, o, s, a) {
            function l(e, i) {
                t.defaults.headers.common.token = "Token " + e,
                t.defaults.headers.common.user = i
            }
            function r() {
                console.log("instantiating"),
                console.log(e),
                x.user = e.user,
                x.authToken = e.token,
                x.user.anonymous && (x.user.votes = {},
                x.user.pinnedTags = [])
            }
            function c(e) {
                return o.open({
                    templateUrl: "app/core/templates/login.html",
                    //stuff... 

也就是说,这是我第一次尝试最小化和gulp -所以帮助我…

您当然需要将$modal服务注入到您自己的服务中:

angular.module('myapp', ['ui.boostrap'])
    .service('AuthUser', ['$modal',
        function ($modal) {
            //stuff with your modal
    }])

此外,除非你有令人信服的理由,否则我建议使用有棱角的servicefactory简写,而不是provider

From the docs:

Provider配方是核心配方类型,所有其他配方类型都只是它上面的语法糖。它是最冗长的配方,但功能最多,但对于大多数服务来说,它是多余的。

Provider recipe在语法上被定义为实现$get方法的自定义类型…如果你定义了一个Factory recipe,一个空的Provider类型将会在底层被自动创建,并将$get方法设置为你的Factory函数。