angularjs - 没有为 Angular 添加 bower 传递依赖

标签 angularjs yeoman bower

我不确定它是如何工作的,所以请原谅我的粗略问题。
我正在玩 Angular ,并注意到 bower 的一些不良行为。我使用 yeoman 创建了我的应用程序,并使用 bower 进行依赖管理。 index.html 文件中有一个部分应由 bower 管理:

<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/select2/select2.js"></script>
<script src="bower_components/angular-ui-select2/src/select2.js"></script>
<script src="bower_components/angular-ui-tinymce/src/tinymce.js"></script>
<!-- endbower -->

我注意到传递依赖项未添加到此列表中。例如 angular-ui-tinymce 依赖于 tinymce。即使 tinymce 是作为传递依赖安装的,它也不包含在 index.html 文件中,所以我必须自己包含它。但这破坏了使用 bower 管理脚本的做法(即,如果我卸载 angular-tinymce,bower 将删除其脚本,但我手动添加的 tinymce 脚本将卡在那里。

可以告诉 bower 在 index.html 文件中添加传递依赖项吗?或者这是一个坏主意,应该手动管理?
这里社区的最佳做法是什么

最佳答案

这实际上是一个名为 grunt-bower-install 的 Grunt 任务。那就是插入到您的 HTML 中。它在您的 Gruntfile.js 中配置如bower-install , 然后可能作为 grunt serve 的一部分运行.也可以直接调用:grunt bower-install .

只要您安装了 Bower 组件并将其保存在您的 bower.json 中, 它及其依赖项将按照与它们的关系匹配的顺序注入(inject)到您的 HTML 中。然而,唯一一次不起作用的是 Bower 组件没有指定 main。拥有自己的属性(property)bower.json文件。

所以,要清楚,你有一个 bower.json列出了您的应用程序的依赖项。此外,您在大多数情况下列出的每个依赖项都有自己的 bower.json列出了它的依赖项(如果有的话)和一个 main属性,它告诉 grunt-bower-install将什么文件注入(inject) HTML。一旦这些依赖项之一未能遵循指定 main 的约定, grunt-bower-install失去它的魔力。

angular-ui-tinymce 的情况下,确实如此list tinymce as a dependency , 但是 tinymce 未配置 bower.json文件。因此,没有 bower.jsonmain属性告诉grunt-bower-install什么文件out of all these注入(inject)。

我能看到的最好的选择是手动写出 <script>如您所说,标记自己,并在您决定不使用它时手动删除它。在最坏的情况下,当 grunt-bower-install行不通,它仍然只是我们这些年来习惯的Web开发。 :)

关于angularjs - 没有为 Angular 添加 bower 传递依赖,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21633247/

相关文章:

javascript - 如何在 Angular 列中使用ng-repeat?

node.js - 使用 Web 生成器时 Yeoman 找不到 'underscore.string'

javascript - 在 Bower 中使用 URL 文件名而不是 index.js

javascript - 生成 polymer 应用程序的 zip,不含所有非生产文件

javascript - SQLError 19 UNIQUE 约束失败

angularjs - 别名匹配 : Match on all except if hash

javascript - 如何使用 AngularJS 在我的 html 页面中的样式中添加一个值

yeoman - 错误没有这样的文件或目录 'bower_components'

javascript - 如何将 browserify 添加到 yeoman 项目中?

ruby - 为什么地基不通过中间人的 sprockets 装载