feat(build-system): dynamic vendoring (#994)

gruntfile.js

@@ -1,23 +1,14 @@
 var autoprefixer = require('autoprefixer');
 var cssnano = require('cssnano');
+var loadGruntTasks = require('load-grunt-tasks');
 
 module.exports = function (grunt) {
 
-  grunt.loadNpmTasks('grunt-contrib-concat');
+  loadGruntTasks(grunt);  
-  grunt.loadNpmTasks('gruntify-eslint');
+
-  grunt.loadNpmTasks('grunt-contrib-uglify');
-  grunt.loadNpmTasks('grunt-contrib-clean');
-  grunt.loadNpmTasks('grunt-contrib-copy');
-  grunt.loadNpmTasks('grunt-contrib-watch');
-  grunt.loadNpmTasks('grunt-html2js');
-  grunt.loadNpmTasks('grunt-shell');
-  grunt.loadNpmTasks('grunt-filerev');
-  grunt.loadNpmTasks('grunt-usemin');
-  grunt.loadNpmTasks('grunt-replace');
-  grunt.loadNpmTasks('grunt-config');
-  grunt.loadNpmTasks('grunt-postcss');
   grunt.registerTask('default', ['eslint', 'build']);
   grunt.registerTask('before-copy', [
+    'vendor:',
     'html2js',
     'useminPrepare:release',
     'concat',
@@ -42,6 +33,7 @@ module.exports = function (grunt) {
     'config:dev',
     'clean:app',
     'shell:buildBinary:linux:amd64',
+    'vendor:regular',
     'html2js',
     'useminPrepare:dev',
     'concat',
@@ -68,32 +60,9 @@ module.exports = function (grunt) {
     src: {
       js: ['app/**/*.js', '!app/**/*.spec.js'],
       jsTpl: ['<%= distdir %>/templates/**/*.js'],
-      jsVendor: [
-        'bower_components/jquery/dist/jquery.min.js',
-        'bower_components/bootstrap/dist/js/bootstrap.min.js',
-        'bower_components/angular-multi-select/isteven-multi-select.js',
-        'bower_components/bootbox.js/bootbox.js',
-        'bower_components/Chart.js/Chart.min.js',
-        'bower_components/filesize/lib/filesize.min.js',
-        'bower_components/lodash/dist/lodash.min.js',
-        'bower_components/moment/min/moment.min.js',
-        'bower_components/splitargs/src/splitargs.js',
-        'bower_components/toastr/toastr.min.js',
-        'bower_components/xterm.js/dist/xterm.js',
-        'assets/js/legend.js' // Not a bower package
-      ],
       html: ['index.html'],
       tpl: ['app/components/**/*.html', 'app/directives/**/*.html'],
-      css: ['assets/css/app.css'],
+      css: ['assets/css/app.css']
-      cssVendor: [
-        'bower_components/bootstrap/dist/css/bootstrap.css',
-        'bower_components/angular-multi-select/isteven-multi-select.css',
-        'bower_components/angular-ui-select/dist/select.min.css',
-        'bower_components/font-awesome/css/font-awesome.min.css',
-        'bower_components/rdash-ui/dist/css/rdash.min.css',
-        'bower_components/toastr/toastr.min.css',
-        'bower_components/xterm.js/dist/xterm.css'
-      ]
     },
     clean: {
       all: ['<%= distdir %>/*'],
@@ -121,29 +90,13 @@ module.exports = function (grunt) {
         }
       }
     },
-    filerev: {
+    filerev: { files: { src: ['<%= distdir %>/js/*.js', '<%= distdir %>/css/*.css'] }},
-      files: {
+    usemin: { html: ['<%= distdir %>/index.html'] },
-        src: ['<%= distdir %>/js/*.js', '<%= distdir %>/css/*.css']
-      }
-    },
-    usemin: {
-      html: ['<%= distdir %>/index.html']
-    },
     copy: {
       bundle: {
         files: [
-          {
+          {dest:'<%= distdir %>/js/',  src: ['app.js'],  expand: true, cwd: '.tmp/concat/js/' },
-            dest: '<%= distdir %>/js/',
+          {dest:'<%= distdir %>/css/', src: ['app.css'], expand: true, cwd: '.tmp/concat/css/' }
-            src: ['app.js'],
-            expand: true,
-            cwd: '.tmp/concat/js/'
-          },
-          {
-            dest: '<%= distdir %>/css/',
-            src: ['app.css'],
-            expand: true,
-            cwd: '.tmp/concat/css/'
-          }
         ]
       },
       assets: {
@@ -169,55 +122,30 @@ module.exports = function (grunt) {
       }
     },
     concat: {
-      css: {
-        src: ['<%= src.cssVendor %>', '<%= src.css %>'],
-        dest: '<%= distdir %>/css/<%= pkg.name %>.css'
-      },
       vendor: {
-        src: ['<%= src.jsVendor %>'],
+        files: {
-        dest: '<%= distdir %>/js/vendor.js'
+          '<%= distdir %>/css/<%= pkg.name %>.css': ['<%= src.cssVendor %>', '<%= src.css %>'],
+          '<%= distdir %>/js/vendor.js': ['<%= src.jsVendor %>'],
+          '<%= distdir %>/js/angular.js': ['<%= src.angularVendor %>']
+        }
       },
       dist: {
         options: { process: true },
-        src: ['<%= src.js %>', '<%= src.jsTpl %>'],
+        files: {
-        dest: '<%= distdir %>/js/<%= pkg.name %>.js'
+          '<%= distdir %>/js/<%= pkg.name %>.js': ['<%= src.js %>', '<%= src.jsTpl %>'],
-      },
+          '<%= distdir %>/index.html': ['index.html']
-      index: {
+        }
-        options: { process: true },
-        src: ['index.html'],
-        dest: '<%= distdir %>/index.html'
-      },
-      angular: {
-        src: [
-        'bower_components/angular/angular.min.js',
-        'bower_components/angular-sanitize/angular-sanitize.min.js',
-        'bower_components/angular-cookies/angular-cookies.min.js',
-        'bower_components/angular-local-storage/dist/angular-local-storage.min.js',
-        'bower_components/angular-jwt/dist/angular-jwt.min.js',
-        'bower_components/angular-ui-router/release/angular-ui-router.min.js',
-        'bower_components/angular-resource/angular-resource.min.js',
-        'bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js',
-        'bower_components/ng-file-upload/ng-file-upload.min.js',
-        'bower_components/angular-utils-pagination/dirPagination.js',
-        'bower_components/angular-google-analytics/dist/angular-google-analytics.min.js',
-        'bower_components/angular-ui-select/dist/select.min.js'],
-        dest: '<%= distdir %>/js/angular.js'
       }
     },
     uglify: {
       dist: {
-        src: ['<%= src.js %>', '<%= src.jsTpl %>'],
+        files: { '<%= distdir %>/js/<%= pkg.name %>.js': ['<%= src.js %>', '<%= src.jsTpl %>'] }
-        dest: '<%= distdir %>/js/<%= pkg.name %>.js'
       },
       vendor: {
         options: { preserveComments: 'some' }, // Preserve license comments
-        src: ['<%= src.jsVendor %>'],
+        files: { '<%= distdir %>/js/vendor.js': ['<%= src.jsVendor %>'] ,
-        dest: '<%= distdir %>/js/vendor.js'
+                 '<%= distdir %>/js/angular.js': ['<%= src.angularVendor %>']
-      },
+        }
-      angular: {
-        options: { preserveComments: 'some' }, // Preserve license comments
-        src: ['<%= concat.angular.src %>'],
-        dest: '<%= distdir %>/js/angular.js'
       }
     },
     postcss: {
@@ -281,4 +209,14 @@ module.exports = function (grunt) {
       }
     }
   });
+
+  grunt.registerTask('vendor', 'vendor:<min|reg>', function(min) {
+    // The content of `vendor.yml` is loaded to src.jsVendor, src.cssVendor and src.angularVendor
+    // Argument `min` selects between the 'regular' or 'minified' sets
+    var m = ( min === '' ) ? 'minified' : min;
+    var v = grunt.file.readYAML('vendor.yml');
+    for (type in v) { if (v.hasOwnProperty(type)) {
+      grunt.config('src.'+type+'Vendor',v[type][m]);
+    }}
+  });
 };

package.json

@@ -43,7 +43,8 @@
     "grunt-replace": "^1.0.1",
     "grunt-shell": "^1.1.2",
     "grunt-usemin": "^3.1.1",
-    "gruntify-eslint": "^3.1.0"
+    "gruntify-eslint": "^3.1.0",
+    "load-grunt-tasks": "^3.5.2"
   },
   "scripts": {
     "postinstall": "bower install"

vendor.yml

@@ -0,0 +1,72 @@
+---
+js:
+  regular:
+  - bower_components/jquery/dist/jquery.js
+  - bower_components/bootstrap/dist/js/bootstrap.js
+  - bower_components/angular-multi-select/isteven-multi-select.js
+  - bower_components/bootbox.js/bootbox.js
+  - bower_components/Chart.js/Chart.js
+  - bower_components/filesize/lib/filesize.js
+  - bower_components/lodash/dist/lodash.js
+  - bower_components/moment/moment.js
+  - bower_components/splitargs/src/splitargs.js
+  - bower_components/toastr/toastr.js
+  - bower_components/xterm.js/dist/xterm.js
+  - assets/js/legend.js
+  minified:
+  - bower_components/jquery/dist/jquery.min.js
+  - bower_components/bootstrap/dist/js/bootstrap.min.js
+  - bower_components/angular-multi-select/isteven-multi-select.js
+  - bower_components/bootbox.js/bootbox.js
+  - bower_components/Chart.js/Chart.min.js
+  - bower_components/filesize/lib/filesize.min.js
+  - bower_components/lodash/dist/lodash.min.js
+  - bower_components/moment/min/moment.min.js
+  - bower_components/splitargs/src/splitargs.js
+  - bower_components/toastr/toastr.min.js
+  - bower_components/xterm.js/dist/xterm.js
+  - assets/js/legend.js
+css:
+  regular:
+  - bower_components/bootstrap/dist/css/bootstrap.css
+  - bower_components/rdash-ui/dist/css/rdash.css
+  - bower_components/angular-multi-select/isteven-multi-select.css
+  - bower_components/angular-ui-select/dist/select.css
+  - bower_components/font-awesome/css/font-awesome.css
+  - bower_components/toastr/toastr.css
+  - bower_components/xterm.js/dist/xterm.css
+  minified:
+  - bower_components/bootstrap/dist/css/bootstrap.min.css
+  - bower_components/rdash-ui/dist/css/rdash.min.css
+  - bower_components/angular-multi-select/isteven-multi-select.css
+  - bower_components/angular-ui-select/dist/select.min.css
+  - bower_components/font-awesome/css/font-awesome.min.css
+  - bower_components/toastr/toastr.min.css
+  - bower_components/xterm.js/dist/xterm.css
+angular:
+  regular:
+  - bower_components/angular/angular.js
+  - bower_components/angular-bootstrap/ui-bootstrap-tpls.js
+  - bower_components/angular-cookies/angular-cookies.js
+  - bower_components/angular-google-analytics/dist/angular-google-analytics.js
+  - bower_components/angular-jwt/dist/angular-jwt.js
+  - bower_components/angular-local-storage/dist/angular-local-storage.js
+  - bower_components/angular-resource/angular-resource.js
+  - bower_components/angular-sanitize/angular-sanitize.js
+  - bower_components/angular-ui-select/dist/select.js
+  - bower_components/angular-ui-router/release/angular-ui-router.js
+  - bower_components/angular-utils-pagination/dirPagination.js
+  - bower_components/ng-file-upload/ng-file-upload.js
+  minified:
+  - bower_components/angular/angular.min.js
+  - bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js
+  - bower_components/angular-cookies/angular-cookies.min.js
+  - bower_components/angular-google-analytics/dist/angular-google-analytics.min.js
+  - bower_components/angular-jwt/dist/angular-jwt.min.js
+  - bower_components/angular-local-storage/dist/angular-local-storage.min.js
+  - bower_components/angular-resource/angular-resource.min.js
+  - bower_components/angular-sanitize/angular-sanitize.min.js
+  - bower_components/angular-ui-select/dist/select.min.js
+  - bower_components/angular-ui-router/release/angular-ui-router.min.js
+  - bower_components/angular-utils-pagination/dirPagination.js
+  - bower_components/ng-file-upload/ng-file-upload.min.js