config.js

System.config({
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "es7.objectRestSpread",
      "es7.decorators",
      "es7.classProperties",
      "runtime"
    ]
  },
  paths: {
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },
  blacklist: {},

  map: {
    //Internal components mapped
    "Components": "app/Components",
    "Data": "app/Data",
    "Events": "app/Events",
    "Services": "app/Services",
    "Utils": "app/Utils",
    
    //Yada yada external deps below
    "react": "npm:react@0.13.3"
    
  }
});

index.html

<script>
    var SPE = window.SPE || {
                apiBaseUrl: "/",
                appName: "XOXODev"
            };

    System.paths = {
            "app/*": "./dist/Scripts/app/*",
            "github:*": "./jspm_packages/github/*",
            "npm:*": "./jspm_packages/npm/*"
        };

    System.import("app/main").then(function () {
        console.log("Done loading bundle");
    });
</script>

jspm-tasks.js

gulp.task("bundle:js:prod", function (cb) {
    exec('jspm bundle-sfx app/main dist/Scripts/build.js --skip-source-maps --minify', cb, cb);
});
gulp.task("bundle:js:dev", function (cb) {
    exec('jspm bundle-sfx app/main dist/Scripts/build.js', cb, cb);
});
gulp.task("bundle:dep", function (cb) {
    exec('jspm bundle app/main - [app/**/*] dist/Scripts/deps.js --skip-source-maps', function (err, stdout, stderr) {
        cb(err);
    })
});
gulp.task("bundle:externalComponents", function(cb){
    exec('jspm bundle app/externalComponents dist/Scripts/externalComponents.js --skip-source-maps', function (err, stdout, stderr) {
        cb(err);
    })
});
gulp.task("bundle:app", function(cb){
    exec('jspm bundle app/main - [jspm_packages/**/*] ' + paths.appBundle , function (err, stdout, stderr) {
        cb(err);
    })
});

package.json

{
  "jspm": {
    "dependencies": {
      "babel": "npm:babel-core@^5.1.13",
      "immutable": "npm:immutable@^3.7.4",
      "react": "npm:react@^0.13.1"
    },
    "devDependencies": {
      "babel": "npm:babel-core@^5.1.13",
      "babel-runtime": "npm:babel-runtime@^5.1.13",
      "core-js": "npm:core-js@^0.9.4"
    }
  }
}

serve-watch-task.js

/**
 * Runs with: gulp serve
 * */
gulp.task('serve', ['pre-serve'], function () {
    var proxyOptions = url.parse('http://localhost/xoxo/api');
    proxyOptions.route = '/api';

    browserSync.init({
        server: {
            baseDir: "./",
            middleware: [proxy(proxyOptions)]
        }
    });
    // add browserSync.reload to the tasks array to make
    // all browsers reload after tasks are complete.
    gulp.watch("styles/**/*.scss", ['sass']);
    gulp.watch(["app/**/*.js", "!**/*.spec.js"]).on('change', function(file){
        reload();
        console.log(path.relative('./', file.path));
        return gulp.src('./' + path.relative('./', file.path), {cwd: "./"})
            .pipe(plumber())
            .pipe(sourcemaps.init())
            .pipe(babel(babelCompilerOptions))
            .pipe(sourcemaps.write())
            .pipe(gulp.dest("./dist/Scripts/" + path.dirname(path.relative('./', file.path))));
    });
});