= typescript = * https://www.typescriptlang.org * https://www.typescriptlang.org/docs/tutorial.html == install == npm install -g typescript == Compile == tsc helloworld.ts == kate == https://github.com/PrettyFlower/KateTypeScriptSyntaxHighlighting {{{ wget https://github.com/PrettyFlower/KateTypeScriptSyntaxHighlighting/raw/master/typescript.xml cp typescript.xml /usr/share/apps/katepart/syntax/typescript.xml }}} With let keyword added {{{#!highlight xml <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE language SYSTEM "language.dtd"> <language name="TypeScript" section="Scripts" extensions="*.ts;" indenter="cstyle" author="PrettyFlower (abigchode@gmail.com)"> <highlighting> <list name="keywords"> <item> if </item> <item> else </item> <item> for </item> <item> in </item> <item> while </item> <item> do </item> <item> continue </item> <item> break </item> <item> with </item> <item> try </item> <item> catch </item> <item> finally </item> <item> switch </item> <item> case </item> <item> new </item> <item> var </item> <item> function </item> <item> return </item> <item> delete </item> <item> true </item> <item> false </item> <item> void </item> <item> throw </item> <item> typeof </item> <item> const </item> <item> default </item> <item> this </item> <item> null </item> <item> undefined </item> <item> class </item> <item> export </item> <item> declare </item> <item> module </item> <item> import </item> <item> static </item> <item> interface </item> <item> implements </item> <item> constructor </item> <item> public </item> <item> private </item> <item> string </item> <item> number </item> <item> bool </item> <item> any </item> <item> extends </item> <item> let </item> </list> <contexts> <context attribute="Normal Text" lineEndContext="#stay" name="Normal"> <DetectSpaces/> <keyword attribute="Keyword" context="#stay" String="keywords"/> <DetectChar attribute="String" context="String" char="""/> <DetectChar attribute="String Char" context="String 1" char="'"/> <StringDetect attribute="Reference" context="Reference" String="///" /> <Detect2Chars attribute="Comment" context="Comment" char="/" char1="/"/> <Detect2Chars attribute="Comment" context="Multi/inline Comment" char="/" char1="*" beginRegion="Comment"/> <DetectIdentifier/> </context> <context attribute="String" lineEndContext="#pop" name="String"> <DetectIdentifier/> <HlCStringChar attribute="String Char" context="#stay"/> <LineContinue attribute="String" context="#stay"/> <DetectChar attribute="String" context="#pop" char="""/> </context> <context attribute="String Char" lineEndContext="#pop" name="String 1"> <DetectIdentifier/> <HlCStringChar attribute="String Char" context="#stay"/> <LineContinue attribute="String" context="#stay"/> <DetectChar attribute="String Char" context="#pop" char="'"/> </context> <context attribute="Comment" lineEndContext="#pop" name="Comment"> <DetectSpaces /> <IncludeRules context="##Alerts" /> <DetectIdentifier /> </context> <context attribute="Comment" lineEndContext="#stay" name="Multi/inline Comment"> <IncludeRules context="##Alerts" /> <Detect2Chars attribute="Comment" context="#pop" char="*" char1="/" endRegion="Comment"/> </context> <context attribute="Reference" lineEndContext="#pop" name="Reference"> <DetectChar attribute="ReferenceBracket" context="#stay" char="<"/> <DetectChar attribute="ReferenceBracket" context="#stay" char=">"/> <DetectChar attribute="ReferenceFile" context="ReferenceFile" char="""/> <DetectChar attribute="ReferenceFile" context="ReferenceFile 1" char="'"/> </context> <context attribute="ReferenceFile" lineEndContext="#pop" name="ReferenceFile"> <DetectIdentifier/> <HlCStringChar attribute="ReferenceFile" context="#stay"/> <LineContinue attribute="ReferenceFile" context="#stay"/> <DetectChar attribute="ReferenceFile" context="#pop" char="""/> </context> <context attribute="ReferenceFile" lineEndContext="#pop" name="ReferenceFile 1"> <DetectIdentifier/> <HlCStringChar attribute="ReferenceFile" context="#stay"/> <LineContinue attribute="ReferenceFile" context="#stay"/> <DetectChar attribute="ReferenceFile" context="#pop" char="'"/> </context> </contexts> <itemDatas> <itemData name="Normal Text" defStyleNum="dsNormal"/> <itemData name="Keyword" defStyleNum="dsNormal" color="#00f"/> <itemData name="Char" defStyleNum="dsChar"/> <itemData name="String" defStyleNum="dsString" color="#a31515"/> <itemData name="String Char" defStyleNum="dsString" color="#a31515"/> <itemData name="Comment" defStyleNum="dsNormal" italic="true" color="#080"/> <itemData name="Reference" defStyleNum="dsNormal" color="#aeb9ae"/> <itemData name="ReferenceBracket" defStyleNum="dsNormal" color="#708870" bold="true"/> <itemData name="ReferenceFile" defStyleNum="dsNormal" color="#2c51cc"/> </itemDatas> </highlighting> <general> <comments> <comment name="singleLine" start="//" /> <comment name="multiLine" start="/*" end="*/" /> </comments> <keywords casesensitive="1"/> </general> </language> }}} == Sample code typescript for browser == {{{ npm install -g typescript npm install -g webpack }}} === greeter.html === {{{ <!DOCTYPE html> <html> <head><title>TypeScript Greeter</title><meta charset="UTF-8"></head> <body> <script src="dist/bundle.js"></script> </body> </html> //lib.ts export function getText(){ return "text"; } === greeter.ts === {{{ import {getText} from "./lib"; interface Person { firstName: string; lastName: string; } function greeterPerson(p:Person) { return "Hello GP, " + p.firstName + ' ' + p.lastName + ' ' + getText() ; } function greeter(person:string) { return "Hello, " + person; } var user = "XPTO User"; //document.body.innerHTML = greeter(user); document.body.innerHTML = greeterPerson( {firstName:"First",lastName:"Last"} ); }}} === tsconfig.json === {{{ { "compilerOptions": { "module": "es6", "noImplicitAny": true, "removeComments": true, "preserveConstEnums": true, "sourceMap": true }, "files": [ "greeter.ts", "lib.ts"] } }}} === webpack.config.js === {{{ var path = require('path'); module.exports = { entry: ['./greeter.js','./lib.js'], output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist') } }; }}} === build === {{{ tsc webpack --config webpack.config.js }}}