zoukankan      html  css  js  c++  java
  • [TypeScript] Loading Compiled TypeScript Files in Browser with SystemJS

    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");
        }
    }
     
  • 相关阅读:
    URLEncode解决url中有特殊字符的问题
    监控系统概览
    SpringBoot 上传文件夹
    关于postgresql报 ERROR: XXX does not exist
    postgresql学习
    git学习
    学习博客
    面试准备
    jvm
    线程池面试题
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5571892.html
Copyright © 2011-2022 走看看