How To Use A Huge Typescript Library Without Polluting Html?
This answer suggests to manually add reference to .js files produced by all used .ts files. I intend to use a library with a complex structure. I already added top files to my html
Solution 1:
You can do that by:
- Organize your code using typescript modules
- Use module loader (systemjs or such) to load modules automatically
Following these two rules your index.html will look something like this:
<!doctype html>
<html>
<head>
<script src="lib/systemjs/dist/system-polyfills.src.js"></script>
<script src="lib/systemjs/dist/system.src.js"></script>
<script>
System.defaultJSExtensions = true;
</script>
</head>
<body>
<script>
document.addEventListener("DOMContentLoaded", function(event)
{//Entry point of the application.
System.import('app').catch(function(e)
{
console.error(e);
});
});
</script>
</body>
</html>
Without need to include every single file.
Solution 2:
The option suggested by Miguel Lattuada, worked with specific library (yendor.ts), despite it used namespaces.
in Visual Studio 2015:
1)Open project settings
2)Go to TypeScript build tab
3)Set "Module System" to "None"
4)Mark "Output"->"Combine JavaScript output into file"
5)Specify absolute path to your app suffixed with combined.js For example, C:\Users\admin\Google Drive\My App\Client\Client\combined.js
6)Add reference to combined.js to your html file.
Post a Comment for "How To Use A Huge Typescript Library Without Polluting Html?"