码迷,mamicode.com
首页 > Web开发 > 详细

[TypeScript] Loading Compiled TypeScript Files in Browser with SystemJS

时间:2016-06-09 06:26:20      阅读:280      评论:0      收藏:0      [点我收藏+]

标签:

TypeScript outputs JavaScript, but what are you supposed to do with it? This lesson shows how to take the output and use SystemJS as the module loader so that you can use the files in your browser.

 

To use system.js, first create a index.html, add system.js file from npmcdn:
https://npmcdn.com/systemjs@0.19.29/

 

index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://npmcdn.com/systemjs@0.19.29/dist/system.js"></script>
</head>
<body>

<script>
    System.config({
        packages: {
            "dist": {
                "defaultExtension": "js",
                "main": "main"
            }
        }
    });

    System.import("dist")
</script>
</body>
</html>

 

It tell System to load the packages. Serve "dist" folder, use default extension as js, and the main entry file is main.js. Then import dist folder.

 

Start a server:

http-server -c-1  // -c-1 -> no cache

 

Run: 

tsc -w

 

To prove it do work in broswer, add console log in the code:

//main.ts

import {Two} from ‘./two‘;

class Person{
    constructor(){
        console.log("Person!");
    }
}

new Two();
new Person();


// tow.ts
export class Two{
    constructor(){
        console.log("Two");
    }
}

 

 

[TypeScript] Loading Compiled TypeScript Files in Browser with SystemJS

标签:

原文地址:http://www.cnblogs.com/Answer1215/p/5571892.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!