Grunt + Concat + Angularjs

Question

設定：

• 具有以下任務的Gruntfile ：

  concat：{構建：{文件：{'build / app.js'：['src / .js'，'src / / .js'，'！src / vendors / ']，}}

• 許多有角度的模塊，及其控制器，服務等，其結構如下：

  a / a.js //模塊聲明，例如：angular.module（'a'，[]）a-controller.ks //在其根模塊定義中設置控制器，例如：angular.module（'a'）。controller （）...

問題：

該任務將在build文件夾中找到的所有js文件連接到一個app.js文件中，雖然可以很好地完成此工作， 但是在連接時會弄亂文件的順序 。

例如，它首先串聯控制器文件而不是包含模塊聲明的主文件夾文件，從而觸發以下錯誤：

模塊xxxx不可用！

我想問題在於concat建立文件的方式，這是由grunt內核（特別是minimatch庫）完成的，它可能將破折號比字母先處理，但是我不知道如何配置來更改行為，甚至知道是否有可能。

題：

因此，問題是：如何使Grunt / Grunt-concat能夠比同一個文件夾中的其他文件先處理破折號f，從而保持順序？

謝謝

更新1：

在深入研究之后，似乎與文件夾內的排序無關，而是Grunt / Core將根文件發送到末尾，然后將它們放在第一個葉文件中。

Answer 1

只需指定要合並文件的順序，然后按順序排列它們，我的意思是，首先添加您應該在開始時串聯的單個文件，在不需要順序的完整文件夾之后，最后添加最后一個文件，類似這樣的東西：

grunt.initConfig({
  concat: {
    js: {
      src: ['lib/before.js', 'lib/*', 'lib/after.js'],
      dest: 'bundle.js',
    }
  }
});

Answer 2

您將必須向grunt-concat任務指定要構建文件的順序。 對於我的項目，我通常會保留一個文件夾結構，其中控制器位於app/controllers文件夾中，服務位於services等中，但是名稱可能會有所不同。 我還保留了一個app.js ，用於聲明我的應用程序模塊並為其指定配置處理程序。 我對grunt-uglify使用了這樣的配置，但是對concat可以做同樣的事情，幾乎沒有變化：

uglify: {
    development: {
        files: {
            'public/scripts/app.js': [
                'public/app/app.js',
                'public/app/controllers/*.js',
                'public/app/directives/*.js',
                'public/app/services/*.js'
            ]
        }
    }
}

Answer 3

我只復制粘貼我的答案，您想要的細節放在第二張照片上，希望對您有所幫助。

您可以考慮此解決方案

1. 將模塊聲明分隔為xxx.module.js

2. 在grunt-contrib-concat中修改如下配置：

   將此放置在grunt.initConfig外部

var clientApp ='./app/';

---

grunt-contrib-concat配置

dist: {// grab module first, state the second
    src: [
        clientApp+'**/*-controller.js',
        clientApp+'**/*.module.js',
        clientApp+'**/*.state.js',
        clientApp+'**/*.js'
        ],
    dest: 'dist/<%= pkg.name %>.js'
}

我使用狀態來表示，所以在嘗試導航到任何狀態之前也必須定義狀態。 這是預覽我的代碼，模塊聲明先聲明為fist，然后是我的狀態。 即使縮小也不會造成任何問題。

希望對您有所幫助。 我遵循了johnpapa的風格指南 ，如果我的解決方案不起作用，您的問題可能會在那里解決