1、我们默认你已经安装了node.js
通过npm安装typescript

npm install -g typescript

2、VSCode 里,点击“终端” “新建终端”,输入 tsc --init  ,会在项目根目录下生成tsconfig.json文件。关于这个文件,有好多资料说要改一下,通常提供了一段json代码,建议读者直接替换掉原来的内容。但是我们复制后报错了,

error TS18003: No inputs were found in config file……一段话

我们将outDir注释后,不再提示错误。也就是说,自动生成的这个文件,如果没有其他要求,就可以不必修改。它还告知了文档:https://aka.ms/tsconfig.json

3、点击终端,选择运行任务,然后输入tsc,选择 tsc 监视 tsconfig.json

我们再次编辑TS文件,就会在同级目录下看到对应的JS文件。

备注:由于我们可以将TS和JS文件放在一起,所以可以忽略第二步中遇到的问题。但是一但我们想要放到不同的文件夹呢?这个问题仍然需要解决

VSCode 自动编译 typescript 为 javascript的更多相关文章

  1. 【ts】 VSCode自动编译TypeScript终端报错

    一.点击终端--运行任务--选择tsc:监视 - tsconfig.json后,终端报出了如下错误:error TS5058: The specified path does not exist 在网 ...

  2. webstorm自动编译typescript

    http://bbs.egret.com/thread-1752-1-1.html http://bbs.egret.com/thread-1912-1-1.html

  3. 安装typescript环境并开启VSCode自动监视编译ts文件为js文件

    一.前言 小编最近开始学习typescript,懂得人都知道,typescript是vue3的基础伴生,配合更加默契.就像vue2和js一样!typescript不像js那样浏览器直接可以解读,需要我 ...

  4. TypeScript 自动编译

    安装Typescript npm install -g typescript 手动编译 tsc greeter.ts 自动编译 tsc -w greeter.ts

  5. [Vscode插件] 自动编译项目中的Sass文件为CSS

    插件名 : Live Sass Compiler 今天在VSCode中发现了一个自动watch项目目录下sass文件的插件,摆脱了在控制台中进行手动watch的繁琐. 安装好以后点击右下角即可自动编译 ...

  6. TypeScript 强类型 JavaScript – Rafy Web 框架选型

    今天看到了 AngularJs 2.0 版本将基于 TypeScript 构建 的消息.与同事们对 TypeScript 展开了讨论.本文记录一些个人的想法. 理想的 JavaScript 开发模式 ...

  7. TypeScript VS JavaScript 深度对比

    TypeScript 和 JavaScript 是目前项目开发中较为流行的两种脚本语言,我们已经熟知 TypeScript 是 JavaScript 的一个超集,但是 TypeScript 与 Jav ...

  8. 使用顶级 VSCode 扩展来加快开发 JavaScript

    使用顶级 VSCode 扩展来加快开发 JavaScript 发表于 2018年08月24日 by 愚人码头 被浏览 3,942 次 分享到:   小编推荐:掘金是一个面向程序员的高质量技术社区,从 ...

  9. Typescript 和 Javascript之间的区别

    TypeScript 和 JavaScript 是目前项目开发中较为流行的两种脚本语言,我们已经熟知 TypeScript 是 JavaScript 的一个超集,但是 TypeScript 与 Jav ...

  10. VSCode搭建node + typescript开发环境

    我们一起来喜欢TypeScript 现在写js不用TypeScript,伦家可能会觉得你是外星人. 是的,TypeScript很大程度增强了代码的可读性,可跟踪性,可维护性和减少了bug. 那么没有理 ...

随机推荐

  1. Kali Win-KeX SL

    内容: 概述 先决条件 用法 开始 声音支持 多屏支持 停止 概述 无缝模式下的 Win-KeX 将在 Windows 桌面的屏幕顶部启动 Kali Linux 面板. 通过面板启动的应用程序将与 M ...

  2. 20 张图带你全面了解 HTTPS 协议,再也不怕面试问到了!

    本文详细介绍了 HTTPS 相较于 HTTP 更安全的原因,包括对称加密.非对称加密.完整性摘要.数字证书以及 SSL/TLS 握手等内容,图文并茂.理论与实战结合.建议收藏! 1. 不安全的 HTT ...

  3. Python自动化结算工资和统计报表|编程一对一教学微信:Jiabcdefh

    实例需求说明 你好,我是悦创. 博客首发:https://bornforthis.cn/column/pyauto/auto_base07.html 学习了 Excel 文件的写入.读取和追加内容,那 ...

  4. 克拉玛依初赛-wp

    MISC 签到 16进制转字符串 base64 再来一次base64 flag 论禅论道 7z解压得到jar 使用decom打开 解密 得到flag WEB pingme 抓包,修改POST提交的参数 ...

  5. Salesforce LWC学习(四十一) If:true 即将弃用?

    本篇参考: https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.reference_dir ...

  6. 构建api gateway之 健康检查

    Healthcheck 由于服务无法保证永远不会下线,而且下线时不一定能有人员能及时发现, 所以api gateway 一般会引入一个监工 Healthcheck, 像大家每年体检一样定时确认服务是否 ...

  7. NetCoreWebApi3.0-------MiniProfiler使用教程

    参考博客:ASP.NET Core WebAPI中的分析工具MiniProfiler - LamondLu - 博客园 (cnblogs.com) 注意事项: 1.不要盲目copy别人的代码 var ...

  8. vue-cli环境搭建 (超详细保姆级教程)

    一.使用之前,我们先来掌握3个东西是用来干什么的. npm: Nodejs下的包管理器. webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资 ...

  9. 聊一聊HTTPS双向认证的简单应用

    目录 背景 准备工作 ASP.NET Core nginx 反向代理 IIS 部署 总结 参考资料 背景 在三方接口对接中,偶尔会遇到需要传递证书的情况,这种方式其实是在SSL握手过程中会同时验证客户 ...

  10. STM32F0库函数初始化系列:GPIO配置

    1 void GPIO_Configuration(void) 2 { 3 RCC_AHBPeriphClockCmd(RCC_AHBPeriph_GPIOA, ENABLE); 4 RCC_AHBP ...