To have something ready for production (and speed it up), you need to package it.
I mean transpiling all files into JavaScript ones and concat them the same way Angular2 does for example. This way you will have several modules contained into a single JS file. This way you will reduce the number of HTTP calls to load your application code into the browser.
As a matter of fact, for the following configuration of SystemJS, you will have one call per module (it’s suitable for development but not really efficient in production):
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/boot')
.then(null, console.error.bind(console));
</script>
This answer could give hints about how module resolution works:
- How does Angular2 resolve imports?
You can do this packaging using Gulp and its plugins:
- https://www.npmjs.com/package/gulp-tsc
- https://github.com/contra/gulp-concat
See the following answers:
- Using Gulp to Concatenate and Uglify files
- https://github.com/JavascriptMick/angular2-gulp-typescript/blob/master/gulpfile.js