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

initial version of browserify sample #31

Merged
merged 1 commit into from
Aug 10, 2015
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions browserify/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
*.js
45 changes: 45 additions & 0 deletions browserify/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
**Install Browserify**
```
npm install -g browserify
```

**Fetch dependencies**
```
npm install
```

**Compile .ts files**
```
node node_modules/typescript/bin/tsc.js
```
shortcut for this command
```
npm run tsc
```

**Run Browserify**
```
browserify src/app.js -o bundle.js -s app
```
shortcut for this command
```
npm run browserify

```

**Start http-server**
```
node node_modules/http-server/bin/http-server -o
```
shortcut for this command
```
npm run listen
```

By default http-server listens on port 8080. If this port is taken use '-p' to specify free port.


**Shortcut for running all steps in a batch**
```
npm run all
```
8 changes: 8 additions & 0 deletions browserify/app.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
body
{
font-family: 'Segoe UI', sans-serif
}

span {
font-style: italic
}
22 changes: 22 additions & 0 deletions browserify/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>TypeScript HTML App</title>
<link rel="stylesheet" href="app.css" type="text/css" />
<script src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.1/require.min.js"></script>
</head>
<body>
<h1>Browserify/TypeScript sample</h1>
<div id="content"></div>

<script>
require(["bundle"], function(app) {
var element = document.getElementById("content");
app.start(function(s) { element.innerText = s; } );
});
</script>

</body>
</html>
21 changes: 21 additions & 0 deletions browserify/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
{
"name": "typescript-browserify",
"version": "1.0.0",
"description": "Browserify/TypeScript demo",
"repository": {
"type": "git",
"url": "https://github.com/Microsoft/TypeScriptSamples.git"
},
"dependencies": {
"http-server": "0.8.0"
},
"devDependencies": {
"typescript": "^1.5.3"
},
"scripts": {
"tsc": "node node_modules/typescript/bin/tsc.js",
"browserify": "browserify src/app.js -o bundle.js -s app",
"listen": "node node_modules/http-server/bin/http-server",
"all": "npm run tsc && npm run browserify && npm run listen"
}
}
8 changes: 8 additions & 0 deletions browserify/src/app.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import { TimeReporter, Printer } from './timeReporter'
import { EOL } from 'os';


export function start(printer: Printer) {
let timeReporter = new TimeReporter(printer);
timeReporter.start();
}
7 changes: 7 additions & 0 deletions browserify/src/node.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
declare module "os" {
export var EOL: string;
}

declare module "util" {
export function format(format: string, ...args: any[]): string;
}
27 changes: 27 additions & 0 deletions browserify/src/timeReporter.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import {format} from "util";

export type Printer = (s: string) => void;

export class TimeReporter
{
timerToken: number;

constructor (private printer: Printer)
{
this.reportDate();
}

start()
{
this.timerToken = setInterval(() => this.reportDate(), 500);
}

stop()
{
clearTimeout(this.timerToken);
}

reportDate() {
this.printer(format("Date is %s", new Date().toUTCString()));
}
}
11 changes: 11 additions & 0 deletions browserify/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{
"compilerOptions": {
"module": "CommonJS",
"target": "es5"
},
"files": [
"src/node.d.ts",
"src/timeReporter.ts",
"src/app.ts"
]
}