tech(systemjs): worked on making optimized builds work with systemjs builder

public/app/app.js

@@ -1,7 +1,8 @@
 define([
-  './app2'
+  './grafana'
 ], function(app) {
   'use strict';
   // backward compatability hack;
+  console.log(app);
   return app.default;
 });

public/app/app2.ts

@@ -1,4 +0,0 @@
-
-import {GrafanaApp} from 'app/grafana_app';
-
-export default new GrafanaApp();

public/app/boot.js

@@ -0,0 +1,11 @@
+(function bootGrafana() {
+  'use strict';
+
+  System.import('app/app').then(function(app) {
+    console.log(app);
+    app.init();
+  }).catch(function(err) {
+    console.log('Loading app module failed: ', err);
+  });
+
+})();

public/app/grafana_app.ts → public/app/grafana.ts

@@ -93,5 +93,6 @@ export class GrafanaApp {
       console.log('Application boot failed:', err);
     });
   }
- }
+}
 
+export default new GrafanaApp();

public/app/systemjs.conf.js

@@ -41,7 +41,7 @@ System.config({
 
   meta: {
     'vendor/angular/angular.js': {
-      format: 'amd',
+      format: 'global',
       deps: ['jquery'],
       exports: 'angular',
     },

public/views/index.html

@@ -57,25 +57,14 @@
 		};
 	</script>
 
-	<!-- build:js [[.AppSubUrl]]/public/app/app.js -->
+	<!-- build:js [[.AppSubUrl]]/public/app/boot.js -->
 	<script src="[[.AppSubUrl]]/public/vendor/npm/es6-shim/es6-shim.js"></script>
 	<script src="[[.AppSubUrl]]/public/vendor/npm/es6-promise/dist/es6-promise.js"></script>
 	<script src="[[.AppSubUrl]]/public/vendor/npm/systemjs/dist/system.src.js"></script>
-	<script src="[[.AppSubUrl]]/public/vendor/npm/rxjs/bundles/Rx.js"></script>
-	<script src="[[.AppSubUrl]]/public/vendor/npm/angular2/bundles/angular2-polyfills.js"></script>
-	<script src="[[.AppSubUrl]]/public/vendor/npm/angular2/bundles/angular2.dev.js"></script>
 	<script src="[[.AppSubUrl]]/public/app/systemjs.conf.js"></script>
+	<script src="[[.AppSubUrl]]/public/app/boot.js"></script>
 	<!-- endbuild -->
 
-	<script>
-		System.import('app/app').then(function(app) {
-			console.log(app)
-			app.init();
-		}).catch(function(err) {
-			console.log('Loading app module failed: ', err);
-		});
-	</script>
-
 	[[if .GoogleAnalyticsId]]
 	<script>
 		(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){

tasks/build_task.js

@@ -10,20 +10,19 @@ module.exports = function(grunt) {
     'clean:release',
     'copy:public_to_gen',
     'typescript:build',
-    'karma:test',
+    // 'karma:test',
     'phantomjs',
     'css',
-    // 'htmlmin:build',
+    'htmlmin:build',
     'ngtemplates',
     'cssmin:build',
     'ngAnnotate:build',
-    'requirejs:build',
+    'systemjs:build',
     'concat:js',
-    'clean:temp',
-    'filerev',
-    'remapFilerev',
+    // 'filerev',
+    // 'remapFilerev',
     'usemin',
-    'uglify:genDir'
+    // 'uglify:genDir'
   ]);
 
   // task to add [[.AppSubUrl]] to reved path

tasks/options/concat.js

@@ -13,6 +13,7 @@ module.exports = function(config) {
       ],
       dest: '<%= genDir %>/css/grafana.dark.min.css'
     },
+
     cssLight: {
       src: [
         '<%= genDir %>/vendor/css/normalize.min.css',
@@ -24,13 +25,24 @@ module.exports = function(config) {
       ],
       dest: '<%= genDir %>/css/grafana.light.min.css'
     },
+
     js: {
       src: [
-        '<%= tempDir %>/vendor/requirejs/require.js',
-        '<%= tempDir %>/app/require_config.js',
-        '<%= tempDir %>/app/app.js',
+        '<%= genDir %>/vendor/npm/es6-shim/es6-shim.js',
+        '<%= genDir %>/vendor/npm/es6-promise/es6-promise.js',
+        '<%= genDir %>/vendor/npm/systemjs/dist/system.js',
+        '<%= genDir %>/app/systemjs.conf.js',
+        '<%= genDir %>/app/boot.js',
+      ],
+      dest: '<%= genDir %>/app/boot.js'
+    },
+
+    bundle_and_boot: {
+      src: [
+        '<%= genDir %>/app/app_bundle.js',
+        '<%= genDir %>/app/boot.js',
       ],
-      dest: '<%= genDir %>/app/app.js'
+      dest: '<%= genDir %>/app/boot.js'
     },
   };
 };

tasks/options/cssmin.js

@@ -3,7 +3,7 @@ module.exports = function(config) {
     build: {
       expand: true,
       cwd: '<%= genDir %>',
-      src: '**/*.css',
+      src: ['css/*.css', 'vendor/css/*.css'],
       dest: '<%= genDir %>'
     }
   };

tasks/options/ngtemplates.js

@@ -7,7 +7,7 @@ module.exports = function(config) {
       options: {
         bootstrap: function(module, script) {
           return "define('app/core/partials', ['app/core/core_module'], function(coreModule) { \n" +
-            "coreModule.run(['$templateCache', function($templateCache) { \n" +
+            "coreModule.default.run(['$templateCache', function($templateCache) { \n" +
                 script +
             '\n}]);' +
           '\n});';

tasks/systemjs_task.js

@@ -2,7 +2,6 @@ module.exports = function(grunt) {
   "use strict";
 
   grunt.registerTask('systemjs:build', function() {
-    var path = require("path");
     var Builder = require('systemjs-builder');
     var done = this.async();
 
@@ -11,11 +10,23 @@ module.exports = function(grunt) {
     var builder = new Builder('public_gen', 'public_gen/app/systemjs.conf.js');
     console.log('Starting systemjs-builder');
 
+    var modules = [
+      'app/app',
+      'app/features/all',
+      'app/plugins/panels/**/*',
+      'app/plugins/datasource/graphite/**/*',
+      'app/plugins/datasource/influxdb/**/*',
+      'app/plugins/datasource/elasticsearch/**/*',
+    ];
+
+    var expression = modules.join(' + ');
+
     builder
-      .bundle('app/app + app/features/all', 'public_gen/app/app.js')
+      .bundle(expression, 'public_gen/app/app_bundle.js')
       .then(function() {
         console.log('Build complete');
         done();
+        grunt.task.run('concat:bundle_and_boot');
       })
       .catch(function(err) {
         console.log('Build error');
@@ -23,5 +34,4 @@ module.exports = function(grunt) {
         done();
       });
   });
-
 };