jspm preprocessing (injecting settings for the targeted environment) when bundling

Question

Is there a way to preprocess the .js files (i.e. inject environment specific settings) when bundling using buildStatic?

Answer 1

I don't know about a way to pre-process js files during bundling but you can have different files/modules for different environments and use JS API to swap your development version with the production one:

gulp.task('jspm', function() {
  var builder = new jspm.Builder();

  function production(builder) {
    var systemNormalize = builder.loader.normalize;
    builder.loader.normalize = function(name, parentName, parentAddress) {
      if (name === 'ember') name = 'ember/ember.prod';
      if (name === './app-config.dev') name = './app-config.prod';

      return systemNormalize.call(this, name, parentName, parentAddress);
    };
  }

  production(builder);

  return builder.loadConfig('./config.js')
    .then(function() {
      return builder.buildStatic('app/main', 'dist/app.min.js', { sourceMaps: false, minify: false, mangle: false});
    });
});

app-config.dev.js and app-config.prod.js are modules that you use throughout the app and that provide your environment-specific settings. In your code, you should always import app-config.dev. Read more about this workflow in my blog post: How to Use SystemJS Hooks for Building a Production Version of Your App