美文网首页
VScode 自动编译TypeScript的配置

VScode 自动编译TypeScript的配置

作者: alokka | 来源:发表于2020-03-18 18:34 被阅读0次

    1. 首先安装 typescript

    npm install -g typescript
    

    2. 在当前目录打开命令行,生成tsconfig.json文件

    tsc --init
    

    3. 在当前目录打开命令行,生成 tsconfig.json 文件

    打开tsconfig.json文件修改和删除相应配置(如果想快速修改配置,请复制下列配置),不配置也可以直接使用默认配置

    {
      "compilerOptions": {
       "target": "es5", // 指定ECMAScript目标版本 这里选择es5
       "noImplicitAny": false, // 隐藏“any”类型在表达式和声明上引发错误,这里选择不隐藏
       "module": "es2015", // 选择模块化加载规范 这里选择es2015 就是es6加载规范
       "removeComments": false, // 不输出注释 这里选择 输出 
       "sourceMap": false, // 生成相应的'.map'文件 这里选择否
       "allowSyntheticDefaultImports": true // 允许从没有设置默认导出的模块中默认导入。这并不影响代码的输出,仅为了类型检查。
      }
    }
    

    这样就会默认在当前.ts文件所属的文件夹下生成对应的.js文件

    中文 tsconfig.json 配置信息查看 请点击这里——https://www.tslang.cn/docs/handbook/compiler-options.html

    4. 打开自己的 .ts 文件 写自己的 ts 代码

    export class Hello {
        
    }
    

    5. 点击 VScode 上方菜单栏的 终端——运行任务——tsc:监视-tsconfig.json

    在这里插入图片描述

    出现下面的页面说明监视成功


    在这里插入图片描述

    6. 此时在当前目录下就会自动生成文件hello.js了,然后我们在编辑ts文件的时候,就会自动监视.ts文件的改变进而生成对应的.js代码。

    刚学 typescript 就卡在了 vscode 自动编译这里 然后就自己查了文档 对网上现有的文档进行总结和简化 希望能对大家有帮助 有错误也请大家给我留言 Thanks♪(・ω・)ノ

    相关文章

      网友评论

          本文标题:VScode 自动编译TypeScript的配置

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