javascript - Error angular de "proveedor desconocido" después de la reducción con la aplicación Grunt Build in Yeoman

angularjs gruntjs

Question

Estoy teniendo problemas con la grunt build en una aplicación Angular generada por Yeoman, usando Coffee y Slim, con todas las bibliotecas actualizadas. (La aplicación se generó hace unos días con el generador más reciente).

grunt build y grunt server funcionaron bien al principio. Pero después de unos días de desarrollo utilizando el grunt server , descubrí que la grunt build había dejado de funcionar por completo.

Hubo algunos problemas diferentes que solucioné. La más importante fue que tuve que abandonar Slim por completo para mi archivo de índice y usar HTML directo, ya que la grunt build estaba eliminando inexplicablemente el 80% del archivo de índice cuando se publicó en /dist .

Desafortunadamente, después de resolver casi todo, comencé a tener este error en una de mis directivas angulares:

Error no detectado: proveedor desconocido: aProvider <- a

El problema parece estar en uglify. Creo que posiblemente podría ser el mismo problema reportado here , pero no estoy absolutamente seguro. Probé varias soluciones, pero lo único que me funcionó fue generar manualmente archivos js limpios desde mi coffeescript, copiar los archivos en /dist y luego escribir las rutas en dist/index.html .

Obviamente eso no es óptimo. Estoy seguro de que hay una forma más ordenada de hacerlo en Grunt (probablemente eliminando la minificación por completo del proceso de compilación, como lo hizo el otro usuario en el enlace de arriba), pero soy nuevo y aún no he descubierto cómo Para hacer eso. De cualquier manera, sería una solución.

My Gruntfile es bastante básico: solo he agregado grunt-connect-proxy, grunt-contrib-sass y grunt-slim al archivo predeterminado. De hecho, traté de traer un Gruntfile nuevo y limpio, pero no se construyó mejor.

La directiva que está fallando está abajo. El error aparece en la primera línea del controlador, $scope.showInput = false . Lo que es frustrante es que todo funciona muy bien en el grunt server . El momento en que construyo, sin embargo, se desmorona por completo.

myModule.directive "editable", ->

  controller = ($scope) ->
    $scope.showInput = false

    $scope.saveContent = -> 
      $scope.toggleContent()
      $scope.save()

  linker = (scope, element, attrs) ->    
    scope.toggleContent = -> 
      scope.showInput = not scope.showInput
      setTimeout((-> element.find(''input'').focus()), 100)

  return DDO = 
    restrict: ''E''
    controller: controller
    link: linker
    templateUrl: "template/editable.html"
    scope:
      editableType: "@"
      text: "="
      placeholder: "@"
      save: "&"

(La plantilla no es realmente importante. Simplemente tiene un ng-switch que alterna usando $scope.showInput ).

Si alguien tiene alguna sugerencia, te lo agradecería.

Answer 1

Suena como el problema común de la dependencia de Angular en el nombre de los argumentos para la inyección de dependencia. Asegúrese de que cuando pase dependencias, incluya los nombres de las dependencias como cadenas para que Angular sepa qué inyectar después de la minimización (ya que los valores de las cadenas no se cambiarán en el proceso de minificación).

myApp.controller(''myCtrl'', [''$scope'', ''$http'', function($scope, $http) {

}])

De documentos en ángulo: una nota sobre minification