Angular“未知提供者"在 Yeoman 应用程序中使用 Grunt Build 缩小后出错 [英] Angular "Unknown Provider" error after minification with Grunt Build in Yeoman app
问题描述
我在 Yeoman 生成的 Angular 应用程序上遇到 grunt build 问题，使用 Coffee 和 Slim，所有库都是最新的.(该应用程序是几天前使用最新的生成器生成的.)
I'm having problems with grunt build on a Yeoman generated Angular app, using Coffee and Slim, with all libraries up-to-date. (The app was just generated a few days ago with the most recent generator.)
grunt build 和 grunt server 最初都运行良好.但是在使用 grunt server 开发几天后，我发现 grunt build 已经完全停止工作.
grunt build and grunt server both worked fine initially. But after a few days of development using grunt server, I discovered that grunt build had stopped working entirely.
我修复了一些不同的问题.最大的一个是我不得不完全放弃 Slim 来创建我的索引文件并使用直接的 HTML，因为 grunt build 在发布到 /dist.
There were a few different problems that I fixed. The biggest one was that I had to abandon Slim entirely for my index file and use straight HTML, since grunt build was inexplicably removing 80% of the index file when it published to /dist.
不幸的是，在我解决了几乎所有问题之后，我的 Angular 指令之一开始出现此错误:
Unfortunately, after I got almost everything resolved, I started getting this error in one of my Angular directives:
未捕获的错误:未知提供者:aProvider <- a
问题似乎出在丑陋上.我认为这可能是此处报告的相同问题，但我不确定.我尝试了多种解决方案，但唯一对我有用的是从我的咖啡脚本手动生成干净的 js 文件，将文件复制到 /dist，然后将路径写入 <代码>dist/index.html.
The problem seems to be in uglify. I think it could possibly be the same problem reported here, but I'm not absolutely sure. I tried a number a number of solutions, but the only thing that has worked for me was to manually generate clean js files from my coffeescript, copy the files into /dist, and then write the paths into dist/index.html.
显然这不是最佳选择.我确信在 Grunt 中有一种更简洁的方法来做到这一点(可能是通过从构建过程中完全删除缩小，就像其他用户在上面的链接中所做的那样)，但我是新手，还没有弄清楚如何要做到这一点.无论哪种方式，这都是一种解决方法.
Obviously that's not optimal. I'm sure there's a neater way to do it in Grunt (probably by removing minification entirely from the build process, as that other user did in the link above), but I'm new to it and haven't yet figured out how to do that. Either way, it would be a workaround.
我的 Gruntfile 非常基础:我只在默认文件中添加了 grunt-connect-proxy、grunt-contrib-sass 和 grunt-slim.事实上，我试图引入一个干净的、新生成的 Gruntfile，但它并没有更好地构建.
My Gruntfile is pretty basic: I've only added grunt-connect-proxy, grunt-contrib-sass, and grunt-slim to the default file. In fact, I tried to bring in a clean, newly-generated Gruntfile but it didn't build any better.
失败的指令如下.错误实际上出现在控制器的第一行，$scope.showInput = false.令人沮丧的是，在 grunt server 中一切正常.然而，在我建造的那一刻，它完全崩溃了.
The directive that's failing is below. The error actually comes up right in the first line of the controller, $scope.showInput = false. What's frustrating is that everything works great in grunt server. The moment I build though, it falls apart entirely.
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: "&"
(模板并不重要.它只有一个 ng-switch 可以使用 $scope.showInput 进行切换.)
(The template isn't really important. It just has an ng-switch that toggles using $scope.showInput.)
如果有人有任何建议，我将不胜感激.
If anybody has any suggestions, I'd appreciate it.
推荐答案
这听起来像是 Angular 依赖于依赖注入的参数名称的常见问题.确保在传递依赖项时将依赖项名称包含为字符串，以便 Angular 在缩小后知道要注入什么(因为在缩小过程中字符串值不会改变).
It sounds like the common issue of Angular's reliance on the name of arguments for dependency injection. Make sure when you pass dependencies that you include the dependency names as strings so that Angular will know what to inject after minification (since string values won't be changed in the minification process).
myApp.controller('myCtrl', ['$scope', '$http', function($scope, $http) {
}])
来自 Angular 文档:关于缩小的说明
From Angular docs: A Note on minification
这篇关于Angular“未知提供者"在 Yeoman 应用程序中使用 Grunt Build 缩小后出错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
