feat(app): Add Babel option

app/index.js

@@ -78,6 +78,13 @@ var AngularFullstackGenerator = yeoman.generators.Base.extend({
 
           return filterMap[val];
         }
+      }, {
+        type: "confirm",
+        name: "babel",
+        message: "Would you like to use Javascript ES6 in your client by preprocessing it with Babel?",
+        when: function (answers) {
+          return answers.script === 'js';
+        }
       }, {
         type: "list",
         name: "markup",
@@ -110,6 +117,9 @@ var AngularFullstackGenerator = yeoman.generators.Base.extend({
           return answers.bootstrap;
         }
       }], function (answers) {
+
+        this.filters.babel = !!answers.babel;
+        if(this.filters.babel){ this.filters.js = true; }
         this.filters[answers.script] = true;
         this.filters[answers.markup] = true;
         this.filters[answers.stylesheet] = true;
@@ -211,6 +221,7 @@ var AngularFullstackGenerator = yeoman.generators.Base.extend({
 
     if(this.filters.ngroute) filters.push('ngroute');
     if(this.filters.uirouter) filters.push('uirouter');
+    if(this.filters.babel) extensions.push('babel');
     if(this.filters.coffee) extensions.push('coffee');
     if(this.filters.js) extensions.push('js');
     if(this.filters.html) extensions.push('html');

app/templates/Gruntfile.js

@@ -127,6 +127,13 @@ module.exports = function (grunt) {
           '<%%= yeoman.client %>/{app,components}/**/*.spec.{coffee,litcoffee,coffee.md}'
         ],
         tasks: ['karma']
+      },<% } %><% if(filters.babel) { %>
+      babel: {
+        files: [
+          '<%%= yeoman.client %>/{app,components}/**/*.js',
+          '!<%%= yeoman.client %>/{app,components}/**/*.spec.js'
+        ],
+        tasks: ['babel']
       },<% } %>
       gruntfile: {
         files: ['Gruntfile.js']
@@ -135,7 +142,11 @@ module.exports = function (grunt) {
         files: [
           '{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.css',
           '{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.html',
+          <% if(filters.babel) { %>
+          '.tmp/{app,components}/**/*.js',
+          <% } else { %>
           '{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.js',
+          <% } %>
           '!{.tmp,<%%= yeoman.client %>}{app,components}/**/*.spec.js',
           '!{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.mock.js',
           '<%%= yeoman.client %>/assets/images/{,*//*}*.{png,jpg,jpeg,gif,webp,svg}'
@@ -442,14 +453,16 @@ module.exports = function (grunt) {
     // Run some tasks in parallel to speed up the build process
     concurrent: {
       server: [<% if(filters.coffee) { %>
-        'coffee',<% } %><% if(filters.jade) { %>
+        'coffee',<% } %><% if(filters.babel) { %>
+        'babel',<% } %><% if(filters.jade) { %>
         'jade',<% } %><% if(filters.stylus) { %>
         'stylus',<% } %><% if(filters.sass) { %>
         'sass',<% } %><% if(filters.less) { %>
         'less',<% } %>
       ],
       test: [<% if(filters.coffee) { %>
-        'coffee',<% } %><% if(filters.jade) { %>
+        'coffee',<% } %><% if(filters.babel) { %>
+        'babel',<% } %><% if(filters.jade) { %>
         'jade',<% } %><% if(filters.stylus) { %>
         'stylus',<% } %><% if(filters.sass) { %>
         'sass',<% } %><% if(filters.less) { %>
@@ -465,7 +478,8 @@ module.exports = function (grunt) {
         }
       },
       dist: [<% if(filters.coffee) { %>
-        'coffee',<% } %><% if(filters.jade) { %>
+        'coffee',<% } %><% if(filters.babel) { %>
+        'babel',<% } %><% if(filters.jade) { %>
         'jade',<% } %><% if(filters.stylus) { %>
         'stylus',<% } %><% if(filters.sass) { %>
         'sass',<% } %><% if(filters.less) { %>
@@ -551,6 +565,24 @@ module.exports = function (grunt) {
           ext: '.js'
         }]
       }
+    },<% } %><% if(filters.babel) { %>
+
+    // Compiles ES6 to JavaScript using Babel
+    babel: {
+      options: { 
+        sourceMap: true
+      },
+      server: {
+        files: [{
+          expand: true,
+          cwd: 'client',
+          src: [
+            '{app,components}/**/*.js',
+            '!{app,components}/**/*.spec.js'
+          ],
+          dest: '.tmp'
+        }]
+      }
     },<% } %><% if(filters.stylus) { %>
 
     // Compiles Stylus to CSS
@@ -620,10 +652,16 @@ module.exports = function (grunt) {
         },
         files: {
           '<%%= yeoman.client %>/index.html': [
-              ['{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.js',
-               '!{.tmp,<%%= yeoman.client %>}/app/app.js',
-               '!{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.spec.js',
-               '!{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.mock.js']
+               [
+                 <% if(filters.babel) { %>
+                 '.tmp/{app,components}/**/*.js',
+                 <% } else { %>
+                 '{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.js',
+                 <% } %>
+                 '!{.tmp,<%%= yeoman.client %>}/app/app.js',               
+                 '!{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.spec.js',
+                 '!{.tmp,<%%= yeoman.client %>}/{app,components}/**/*.mock.js'               
+               ]
             ]
         }
       },<% if(filters.stylus) { %>

app/templates/_package.json

@@ -45,7 +45,9 @@
     "grunt-contrib-watch": "~0.6.1",<% if(filters.coffee) { %>
     "grunt-contrib-coffee": "^0.10.1",<% } %><% if(filters.jade) { %>
     "grunt-contrib-jade": "^0.11.0",<% } %><% if(filters.less) { %>
-    "grunt-contrib-less": "^0.11.0",<% } %>
+    "grunt-contrib-less": "^0.11.0",<% } %><% if(filters.babel) { %>
+    "karma-babel-preprocessor": "^5.2.1",
+    "grunt-babel": "~5.0.0",<% } %>
     "grunt-google-cdn": "~0.4.0",
     "grunt-newer": "~0.7.0",
     "grunt-ng-annotate": "^0.2.3",

app/templates/client/index.html

@@ -50,7 +50,11 @@
       <script src="socket.io-client/socket.io.js"></script><% } %>
     <!-- endbuild -->
 
+        <% if(filters.babel) { %>
+        <!-- build:js(.tmp) app/app.js -->
+        <% } else { %>
         <!-- build:js({.tmp,client}) app/app.js -->
+        <% } %>
         <script src="app/app.js"></script>
           <!-- injector:js -->
           <!-- endinjector -->

app/templates/karma.conf.js

@@ -36,7 +36,8 @@ module.exports = function(config) {
 
     preprocessors: {
       '**/*.jade': 'ng-jade2js',
-      '**/*.html': 'html2js',
+      '**/*.html': 'html2js',<% if(filters.babel) { %>
+      'client/app/**/*.js': 'babel',<% } %>
       '**/*.coffee': 'coffee',
     },
 
@@ -48,6 +49,20 @@ module.exports = function(config) {
       stripPrefix: 'client/'
     },
 
+    <% if(filters.babel) { %>
+    babelPreprocessor: {
+      options: {
+        sourceMap: 'inline'
+      },
+      filename: function (file) {
+        return file.originalPath.replace(/\.js$/, '.es5.js');
+      },
+      sourceFileName: function (file) {
+        return file.originalPath;
+      }
+    },
+    <% } %>
+
     // list of files / patterns to exclude
     exclude: [],
 

readme.md

@@ -35,7 +35,7 @@ Run `grunt` for building, `grunt serve` for preview, and `grunt serve:dist` for
 
 **Client**
 
-* Scripts: `JavaScript`, `CoffeeScript`
+* Scripts: `JavaScript`, `CoffeeScript`, `Babel`
 * Markup:  `HTML`, `Jade`
 * Stylesheets: `CSS`, `Stylus`, `Sass`, `Less`,
 * Angular Routers: `ngRoute`, `ui-router`

test/fixtures/bower.json

@@ -5,7 +5,6 @@
     "angular": ">=1.2.*",
     "json3": "~3.3.1",
     "es5-shim": "~3.0.1",
-    "jquery": "~1.11.0",
     "bootstrap-sass-official": "~3.1.1",
     "bootstrap": "~3.1.1",
     "angular-resource": ">=1.2.*",

test/fixtures/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "main": "server/app.js",
   "dependencies": {
-    "express": "~4.0.0",
+    "express": "~4.9.0",
     "morgan": "~1.0.0",
     "body-parser": "~1.5.0",
     "method-override": "~1.0.0",
@@ -46,6 +46,8 @@
     "grunt-contrib-coffee": "^0.10.1",
     "grunt-contrib-jade": "^0.11.0",
     "grunt-contrib-less": "^0.11.0",
+    "karma-babel-preprocessor": "^5.2.1",
+    "grunt-babel": "~5.0.0",
     "grunt-google-cdn": "~0.4.0",
     "grunt-newer": "~0.7.0",
     "grunt-ng-annotate": "^0.2.3",

test/test-file-creation.js

@@ -145,6 +145,49 @@ describe('angular-fullstack generator', function () {
 //      });
     });
 
+    describe('with Babel ES6 preprocessor', function() {
+      beforeEach(function() {
+        helpers.mockPrompt(gen, {
+          script: 'js',
+          babel: true,
+          markup: 'jade',
+          stylesheet: 'less',
+          router: 'uirouter'
+        });
+      });
+
+      it('should run client tests successfully', function(done) {
+        this.timeout(60000);
+        gen.run({}, function () {
+          exec('grunt test:client', function (error, stdout, stderr) {
+            expect(stdout, 'Client tests failed \n' + stdout ).to.contain('Executed 1 of 1\u001b[32m SUCCESS\u001b');
+            done();
+          });
+        });
+      });
+
+      it('should pass jshint', function(done) {
+        this.timeout(60000);
+        gen.run({}, function () {
+          exec('grunt jshint', function (error, stdout, stderr) {
+            expect(stdout).to.contain('Done, without errors.');
+            done();
+          });
+        });
+      });
+
+      it('should run server tests successfully', function(done) {
+        this.timeout(60000);
+        gen.run({}, function () {
+          exec('grunt test:server', function (error, stdout, stderr) {
+            expect(stdout, 'Server tests failed (do you have mongoDB running?) \n' + stdout).to.contain('Done, without errors.');
+            done();
+          });
+        });
+      });
+    });
+
+
     describe('with other preprocessors and oauth', function() {
       beforeEach(function() {
         helpers.mockPrompt(gen, {