通过grunt将不同的javascript依赖项插入索引？

Question

在我的gruntfile中，我已经定义了一个我需要插入索引的javascript文件数组，它们包括依赖项（jquery等）以及构成我的角度应用程序的文件（控制器，服务等）。

我在一个任务中使用这个数组，它将它们组合在一起并缩小它们，这样我就有了一个最终的js文件，这对生产有好处，但对于开发工作，我更喜欢单独插入文件以便于调试。< / p>

是否有一个grunt插件可以让我：

1. 将数组中的每个脚本分别插入索引
2. 将缩小的脚本插入索引
3. 在两者之间轻松切换，这样我就不需要进入并手动删除每个脚本然后添加缩小的脚本，因此我可以在为dev构建的任务中插入完整的脚本并插入连接的脚本在prod任务的构建中。

我发现了一些插件（文件块和注入器）似乎做了我想要的但我无法让它们工作所以如果你还可以提供一个如何为构建开发配置插件的示例并建立生产任务。

Answer 1

我终于找到了一个grunt插件，可以完成我想要的grunt-file-blocks，虽然最初它似乎不适合我，但我误读了文档而且作者非常善良to help me

基本上我所做的是在我的index.html中标记我想要插入js依赖项，如此

<!-- fileblock:js blockName1 -->
<!-- endfileblock -->

<!-- fileblock:js blockName2 -->
<!-- endfileblock -->

然后在我的Gruntfile.js中设置任务：

fileblocks: {
  dev: {
    files: [{
      src: 'index.html',
      options: {removeFiles: true},
      blocks: {
        'blockName1': { src: arrayOfDevDepenices },
        'blockName2': { src: arrayOfDevDepenices }
      }
    }]
  },

dist: {
    files: [{
      src: 'index.html',
      options: {removeFiles: true},
      blocks: {
        'blockName1': { src: arrayOfDistDepenices },
        'blockName2': { src: arrayOfDistDepenices }
      }
    }]
  }
}

现在使用简单的grunt fileblocks:dev我可以在开发工作的索引中设置我的依赖关系，而使用grunt fileblocks:dist我准备索引以进入生产。