Aurelia bundling and transpiling

2
votes

I'm currently trying to bundle an Aurelia app for "production". I tried using $ aurelia bundle, or now with gulp; which is quite the same. But I'll always have 

<script src="jspm_packages/system.js"></script>
<script src="config.js"></script>
<script>
  System.import('aurelia-bootstrapper');
</script>

In my index.html, which mean that I have to upload jspm packages on my server (ok, not all maybe), and that Babel's 1.9mb browser.js file will be loaded in the browser and only then it will transpilate. It can be pretty long.

Is there any way to get a bundled-transpiled-minified file? Does it make sense? Thanks a lot!

Here's my config (in my gulpfile.js)

  bundles: {
    "src/dist/app-bundle": {
      includes: [
        '*',
        'aurelia-bootstrapper',
        'aurelia-fetch-client',
        'aurelia-router',
        'aurelia-templating-binding',
        'aurelia-templating-resources',
        'aurelia-templating-router',
        'aurelia-loader-default',
        'aurelia-history-browser',
        'aurelia-auth'
      ],
      options: {
        inject: true,
        minify: true
      }
    }
  }
1
javascriptecmascript-6babeljsaurelia
I don't understand how system.js and config.js implies needing browser.js or even any jspm packages? In order to load system.js, you only need the files in the top-level of jspm_packages (on my system, currently, that is system.js, system-csp-production.js, and system-polyfills.js) – Michael Malone

1 Answers

1
votes

Sounds like you have runtime option for babel enabled where babel is only transpiling your JavaScript at runtime instead of at development time.

If you set your bundle to be injected at runtime instead of transpiled then it should be much faster and a smaller footprint.