These files actually contain a packaged version of Angular2 and its dependencies, designed for use within a TypeScript-based application. TypeScript itself cannot run directly in browsers without being preprocessed to compile into ES code using the TypeScript compiler or transpiled in-browser with the TypeScript library.
To configure this in SystemJS, you can utilize the transpiler
attribute (see below).
Start by including these files in your HTML document:
<script src="https://code.angularjs.org/2.0.0-beta.2/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.2/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.2/angular2.dev.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.2/http.dev.js"></script>
If you want to transpile TypeScript files directly in the browser without using NPM, you can set up SystemJS as follows:
<script>
System.config({
transpiler: 'typescript',
typescriptOptions: {
emitDecoratorMetadata: true
},
packages: {
'app': {
defaultExtension: 'ts'
}
}
});
System.import('app/main')
.then(null, console.error.bind(console));
</script>
Ensure that your TypeScript files are located under an app
folder.
For a detailed example using plunkr, check out: https://plnkr.co/edit/vYQPePG4KDoktPoGaxYu?p=info.
You can download the corresponding code and host it locally with services like http-server
, providing a viable solution without relying on NPM. This setup serves as a solid foundation for your specific scenario...
Edit
If your TypeScript files are compiled through Visual Studio, adjust the SystemJS configuration accordingly:
<script>
System.config({
packages: {
app: {
defaultExtension: 'js',
}
}
});
System.import('app/boot')
.then(null, console.error.bind(console));
</script>
This modification allows SystemJS to load JS files upon import requests. For instance, System.import('app/boot')
will correctly access app/boot.js
instead of the TypeScript file.