I'm getting more into System.js and JSPM, where I've come to the point where I want to bundle my TypeScript source code into a JavaScript bundle.
Now I can bundle my generated JavaScript code with something like:
jspm bundle some/source/path someDestFile.js
but then I need to pre-build all my TypeScript first into JavaScript and then bundle, finding myself left with all the compiled (and seperated) JS files. This is far from ideal!
I walked through the jspm docs here, but did not find a solution.
Just to be clear, I do not want to compile TypeScript in my browser, rather a precompiled bundle of solid JavaScript.
How do I do this?
P.S. I used the TypeScript transpiler installation as seen here
You can do it with JSPM builder.
You can bundle all typescript files and bundlesfx to one single file, configurating jspm.conf.js like that:
System.config({
defaultJSExtensions: true,
transpiler: "typescript",
typescriptOptions: {
"module": "amd",
"experimentalDecorators": true
},
...
packages: {
"app": {
"main": "index",
"defaultExtension": "ts",
"meta": {
"*.ts": {
"loader": "ts"
}
}
}
});
and then run :
jspm bundle-sfx src/index dist/app.js
You can see full workign example in here: https://github.com/b091/ts-skeleton/
I believe the question is getting out of date. I just tried this with JSPM 0.17.0-beta.31 with plugin-typescript (https://github.com/frankwallis/plugin-typescript), and "jspm bundle" did indeed pre-translate the TypeScript for me.
"jspm bundle-sfx" is now "jspm build". Because the original accepted answer suggested switching to bundle-sfx (build), which should not be necessary now, I'd like to clarify the decision of whether to use bundle or build. I find bundle to be more useful for speeding up development, whereas build can produce a smaller file with more optimizations, so you may want to use bundle during development and build when you release. Be aware that if you use build on a library, code that imports your library will be unable to share its dependencies.