Question

Yeoman构建了我的第一个角度应用程序，并且在index.html中，它放置了以下代码，我猜测它将被某些构建过程消耗（我不知道那个过程是什么。）

但是在index.html中，它分解了这3个评论组之间的脚本。最后一个似乎是我的代码所在，但前两个在他们的区别中有点武断。我正在试图找出它们的含义，所以我知道在哪里插入这些我需要添加的部分以使应用程序可用：

  <script src="bower_components/angular-ui-calendar/calendar.js"></script>
  <script src="bower_components/ng-grid/ng-grid-2.0.7.min.js"></script>

它们属于第一组（ build：js scripts / plugins.js ）还是第二组（ build：js scripts / modules.js ）？为什么这些群体之外的jquery和棱角分明。感觉就像我需要处理这些指令所做的那样，但谷歌搜索 build：js 不会产生看起来相关的结果。

  <script src="bower_components/jquery/jquery.js"></script>
  <script src="bower_components/angular/angular.js"></script>

  <!-- build:js scripts/plugins.js -->
    <script src="bower_components/bootstrap-sass/js/bootstrap-affix.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-alert.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-dropdown.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-tooltip.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-modal.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-transition.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-button.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-popover.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-typeahead.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-carousel.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-scrollspy.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-collapse.js"></script>
    <script src="bower_components/bootstrap-sass/js/bootstrap-tab.js"></script>
  <!-- endbuild -->

  <!-- build:js scripts/modules.js -->
    <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>
  <!-- endbuild -->

  <!-- build:js({.tmp,app}) scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
  <!-- endbuild -->

对相关文档的解释或指示非常有用。

Answer 1

Yeoman构建了我的第一个角度应用程序，在index.html中，它放下我猜的下面的代码会被一些人使用构建过程（我不知道那个过程是什么。）

“构建过程”是grunt，但更具体地说，grunt-usemin插件将使用index.html中注释块内的指令。

它们属于第一组（build：js scripts / plugins.js）还是第二个（build：js scripts / modules.js）？

这是你做出的决定。请记住，每个块中包含的所有脚本都将连接并缩小为index.html文件的内置版本中的单个脚本。 “build：js scripts / plugins.js”指令告诉grunt构建系统这是一个javascript块，并根据连接和缩小块内容的结果创建一个plugins.js。

为什么这两组之外的jquery和棱角分明？

您可以根据需要对脚本进行分组和分类，但有一些最佳做法。例如，您可能希望将您拥有的所有脚本放在一个块中，因为它们可能经常更改。这可能有助于提高客户端的缓存性能，因为对脚本的更改可能不会导致重新下载所有脚本。您可能不希望在与代码相同的块中包含jQuery和Angular脚本，因为它会构建一个非常大的（单片）脚本，每次更新代码时都必须重新加载。

我通常按类别组织我的组，例如第三方插件，库或模块。有时，如果性能是关键，我可能会考虑我的组，我希望每个类别中的脚本更新频率，这样就不会强迫用户下载没有真正改变的代码。

感觉我需要对这些指令做什么处理，但是用于构建的谷歌搜索：js不会产生看起来像的结果相关的。

阅读grunt-usemin插件页面上的文档，了解如何使用您所看到的“指令”。

Answer 2

我认为jQuery和Angular不在外面，因为默认情况下，grunt cdnify会更改这些路径以使用Google的CDN。

scripts / plugins.js和scripts / modules.js有什么区别？

2 个答案: