Skip to content
This repository was archived by the owner on Oct 12, 2022. It is now read-only.

Commit 8fd968d

Browse files
committed
initial version of SystemJS/TypeScript sample
1 parent e395900 commit 8fd968d

File tree

7 files changed

+106
-0
lines changed

7 files changed

+106
-0
lines changed

systemjs/README.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
**Fetch dependencies:**
2+
```
3+
npm install
4+
```
5+
6+
**Run (using port 8080)**
7+
```
8+
npm start
9+
```
10+
11+
**Run server on custom port**
12+
```
13+
node node_modules/http-server/bin/http-server -p 8080
14+
```
15+
16+
'-p' sets the port to use, default port is 8080. If it is taken pick any port that is free.
17+
After server is started open 'localhost:8080' in a browser.

systemjs/app.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
body
2+
{
3+
font-family: 'Segoe UI', sans-serif
4+
}
5+
6+
span {
7+
font-style: italic
8+
}

systemjs/app.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { Greeter } from 'greeter'
2+
3+
export function main(el: HTMLElement): void {
4+
let greeter = new Greeter(el);
5+
greeter.start();
6+
}

systemjs/deps/es6-module-loader.js

Lines changed: 8 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

systemjs/greeter.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
export class Greeter
2+
{
3+
element: HTMLElement;
4+
span: HTMLElement;
5+
timerToken: number;
6+
7+
constructor (element: HTMLElement)
8+
{
9+
this.element = element;
10+
this.element.innerText += "The time is: ";
11+
this.span = document.createElement('span');
12+
this.element.appendChild(this.span);
13+
this.span.innerText = new Date().toUTCString();
14+
}
15+
16+
start()
17+
{
18+
this.timerToken = setInterval(() => this.span.innerText = new Date().toUTCString(), 500);
19+
}
20+
21+
stop()
22+
{
23+
clearTimeout(this.timerToken);
24+
}
25+
}

systemjs/index.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<html>
2+
<head>
3+
<title>SystemJS/TypeScript Sample</title>
4+
<link rel="stylesheet" href="app.css" type="text/css" />
5+
<script src="/deps/es6-module-loader.js"></script>
6+
<script src="https://jspm.io/[email protected]"></script>
7+
</head>
8+
<body>
9+
<script>
10+
System.transpiler = 'typescript';
11+
System.meta['typescript'] = { format: 'global', exports: 'ts' };
12+
System.paths = {
13+
'*': '*.ts',
14+
'typescript': 'node_modules/typescript/bin/typescript.js'
15+
}
16+
System.import('app').then(function(m) {
17+
var element = document.getElementById("content");
18+
m.main(element);
19+
});
20+
</script>
21+
<h1>SystemJS/TypeScript Sample</h1>
22+
<div id="content"></div>
23+
</body>
24+
</html>

systemjs/package.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"name": "typescript-systemjs",
3+
"version": "1.0.0",
4+
"description": "SystemJS/TypeScript demo",
5+
"repository": {
6+
"type": "git",
7+
"url": "https://github.com/Microsoft/TypeScriptSamples.git"
8+
},
9+
"dependencies": {
10+
"http-server": "0.8.0"
11+
},
12+
"devDependencies": {
13+
"typescript": "mhegazy/typescript#v1.5-beta2"
14+
},
15+
"scripts": {
16+
"start": "node node_modules/http-server/bin/http-server"
17+
}
18+
}

0 commit comments

Comments
 (0)