美文网首页
Typescript中调用Javascript中的函数

Typescript中调用Javascript中的函数

作者: 祥龙翔天 | 来源:发表于2020-07-28 19:05 被阅读0次

    这可能是全网最简单的全面展示Typescript中调用Javascript中的函数操作流程

    适合小白参考

    首选确保你的系统安装好了typescript环境

    打开终端输入命令 tsc -v,得到下图

    tsc -v

    正确显示版本号说明Typescript正常安装了

    新建目录 TS_CALL_JS_FUN,且创建子目录js
    其目录结构如下

    |-- TS_CALL_JS_FUN
    |    |--js

    js目录下创建ext.js,其内容如下

    function abc() {
        alert("wahaha");
    }
    

    TS_CALL_JS_FUN目录下创建main.ts,其内容如下

    declare var abc: any;
    
    function hello(compiler: string) {
        console.log(`Hello from ${compiler}`);
        abc();
    }
    
    hello("TypeScript");
    

    TS_CALL_JS_FUN目录下创建test.html,其内容如下

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html>
    <html>
    
    <head>
        <meta charset="utf-8" />
    
        <script src="js/ext.js"></script>
        <script src="main.js"></script>
    </head>
    </html>
    

    TS_CALL_JS_FUN目录下执行命令 tsc main.ts,以生成 main.js 文件

    现在的目录结构

    |-- TS_CALL_JS_FUN
    |    |--js
    |    |    |--ext.js
    |    |--main.js
    |    |--main.ts
    |    |--test.html

    现在你可以双击运行test.html来看效果

    参考
    https://www.tinymind.net.cn/articles/c411185d518414

    相关文章

      网友评论

          本文标题:Typescript中调用Javascript中的函数

          本文链接:https://www.haomeiwen.com/subject/cwfxrktx.html