Use TypeScript directly in HTML Script tags
npm install text-typescripthtml
`
And to make it work, also load the dependencies.
`html
`
Example,
`html
"text/typescript" example
`
Working Example : editor.sbcode.net
Functionality Supported
_CTRL+click to open links in new tab/window_
| | | |
| ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------ |
| Common Types | Working Example | ✅ |
| Classes | Working Example | ✅ |
| Interfaces | Working Example | ✅ |
| Extending Classes | Working Example | ✅ |
| Abstract Classes | Working Example | ✅ |
| Access Modifiers | Public Private Protected | ✅✅❌ |
| Static Members | Working Example | ✅ |
| ES6 Imports/Exports | Working Example | ✅\* |
\* : Caveat. ES6 Imports and Exports work if you follow some rules.
1. Create multiple text/typscript tags, with the id of the module name.
2. Order the text/typscript tags in compilation order.
3. The final text/typscript tag will be the entry point. Don't name it with any id. Any preceding text/typscript tags that have been id'd will be setup as modules in memory via an importmap` containing multiple data URLs.