Question

我不确定它是如何运作的，所以请原谅我粗略的问题。我正在玩角度，并注意到凉亭有一些不受欢迎的行为。我用自耕农创建了我的应用程序，并使用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 -->

我注意到传递依赖项未添加到此列表中。例如，角度ui-tinymce取决于tinymce。尽管tinymce作为传递依赖安装，但它不包含在index.html文件中，所以我必须自己包含它。但这打败了管理脚本的实践，包括用bower（即如果我卸载angular-tinymce，bower将删除它的脚本，但我手动添加的tinymce脚本将挂在那里。

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

Answer 1

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

只要您在bower.json中安装并保存了Bower组件，它及其依赖项将按照与其关系匹配的顺序注入到您的HTML中。但是，唯一不适用的是Bower组件未在其main文件中指定bower.json属性。

因此，要清楚，您有bower.json列出了应用的依赖关系。此外，您在大多数时间列出的每个依赖项都有自己的bower.json列出其依赖项（如果有），以及main属性，它告诉像grunt-bower-install这样的东西注入HTML。只要其中一个依赖项无法遵循指定main的约定，grunt-bower-install就会失去它的魔力。

如果是angular-ui-tinymce，则确实list tinymce as a dependency，但tinymce未配置bower.json文件。因此，没有bower.json具有main属性来告诉grunt-bower-install要注入的文件out of all these。

我能看到的最佳选择是手动自行写出<script>标签，就像你说的那样，只是在您决定不使用它时手动删除它。在最糟糕的情况下，当grunt-bower-install不起作用时，它仍然只是我们这些年来习惯的网络开发。：）

Answer 2

正确的解决方案是为您的bower.json文件添加覆盖，以获取bower必须生成bower.json文件的任何软件包，该文件将缺少主文件。例如：

  "dependencies": {
    "angular": "1.2.26",
    "angular-sanitize": "1.2.26",
    "angular-route": "1.2.26",
    "jquery": "1.11.1",
    "bootstrap": "3.1.1",
    "jquery-migrate": "1.2.1",
    "angular-ui-tinymce": "latest",
    "json3":"3.3.2",
    "es5-shim": "3.1.1"
  },
  "overrides": {
    "tinymce": {
      "main": "tinymce.min.js"
    }
  }

此处tinymce是angular-ui-tinymce的传递依赖关系，其生成的bower.json文件没有main，因此我们在override部分提供了一个路径相对于包根。

凉亭传递依赖性没有添加角度

2 个答案: