当前位置: 首页 > news >正文

在vscode中使用Typescript并运行

首先呢,我们在学习ts之前,需要先安装ts

1、安装 typescript

npm install -g typescript //检查是否安装tsc -v

2、生成配置文件,cd进入该文件夹,在控制台输 

tsc --init

 此时我们就可以看到在ts文件夹下面出现了 一个tsconfig.json的文件

3、编译ts文件

(1)第一种方法可以直接通过命令编译

例如我们创建一个test.ts文件,可以在控制台 输入tsc +文件名 进行编译

tsc test.ts

当然这个操作就比较繁琐了,那就考虑第二种方式了

(2)vscode自动化编译ts文件

由于浏览器是识别不了ts文件的,因此编译的过程就是将ts文件编译为js文件

如何设置呢?

第一二步如下

第三步,点击终端中的运行任务 

 

 

 看下效果,此时我们新建一个demo.ts,控制台就会自动监视运行

 并在js文件夹中自动生成了对应的demo.js文件

 此时我们对比一下,就达到了预期的目标。

如何在控制台直接运行ts,并可查看打印等输出内容

1、在vscode中安装插件 Code Runner

2、安装ts包

npm  i typescript ts-node @types/node@* -g

 3、点击文件右上角的运行按钮即可

此时就可以开启ts的学习之路了~

相关文章:

在vscode中使用Typescript并运行

首先呢,我们在学习ts之前,需要先安装ts 1、安装 typescript npm install -g typescript //检查是否安装tsc -v ​ 2、生成配置文件,cd进入该文件夹,在控制台输 tsc --init ​ 此时我们就可以看到在ts文件夹下面出现了 一个tsco…...

【C++提高编程】C++全栈体系(十九)

C提高编程 第三章 STL - 常用容器 一、string容器 1. string基本概念 本质: string是C风格的字符串,而string本质上是一个类 string和char * 区别: char * 是一个指针string是一个类,类内部封装了char*,管理这个…...

Java版电能表协议解析源码(DL/T645-2007)、Modbus串口虚拟工具、网络串口调试工具分享

什么是Modbus通信协议Modbus串口调试工具Java版协议解析源码 网络与串口二合一调试助手TCPCOM: https://download.csdn.net/download/liuyuan_java/87454762 Modbus调试工具,模拟串口调试工具 https://download.csdn.net/download/liuyuan_java/874274…...

2023美赛选题建议 美国大学生数学建模竞赛ABCDEF题

选题建议和粗略思路已更新完毕 对于没有基础的同学来说CD两题上手难度较高,大家可以根据自己的实际情况选择最适合自己的题目,团队将持续更新各题后续内容,Q群322297051 A题主要难度就是建立第一问的模型,综合来看难度不大&…...

2023,想跳槽的可以再等等

今天讲讲跳槽。 金三银四即将开启,一些不满现状,被外界的“高薪”“好福利”吸引的人,一般就在这时候毅然决然地跳槽了。 跳槽是为了寻求更好的发展,但在跳槽前我们也不能确定下家就是更好的归宿,这就更加需要我们审…...

Java之滑动窗口详解

目录 一.滑动窗口 1.什么滑动窗口 2.滑动窗口的三要素 二.找到字符串中所有字母异位词 1.题目描述 2.问题分析 3.代码实现 三.字符串的排列 1.题目描述 2.问题分析 3.代码实现 四.考试的最大困扰度 1.题目描述 2.问题分析 3.代码实现 五.替换后的最长重复字符 …...

Webpack(应用一:基本使用,只需六步骤)

前言 上一篇文章已经说明了webpack的定义以及需求 本偏文章主要讲解webpack的基本使用 tips:现在以vscode编辑器来展示,只需要几个步骤就可以实现webpack的基本使用。 一、首先要安装node.js 1、不会安装node.js的,可以在网上自己找教程来…...

【Python小游戏】智商爆棚,推荐一款益智类亲子娱乐首选—某程序员老爸:成语编成填空“游戏”,贪玩女儿1天牢记500词(厉害了我的Python)

前言 成语填空想必大家都是十分熟悉的了,特别是有在上小学的家长肯定都有十分深刻的印象。 在我们的认知里看图猜成语不就是一些小儿科的东西吗? 当然了你也别小看了成语调控小游戏,有的时候知识储备不够,你还真的不一定猜得出…...

使用web3连接Georli测试网络

文章目录1.使用geth方式在终端2.写成脚本2.1 通过metamask (现成的太复杂,搞不太来)2.2 通过自己的接口3.通过truffle方式连接 (不成功)目前的工作情况是,已在remix写好执行合约并部署在Georli测试网络中&a…...

Python uWSGI 的安装配置

以 Ubuntu/Debian 为例,先安装依赖包: apt-get install build-essential python-dev Python 安装 uWSGI 1、通过 pip 命令: pip install uwsgi 2、下载安装脚本: curl http://uwsgi.it/install | bash -s default /tmp/uwsgi 将…...

033.Solidity入门——20函数的可视范围

修饰符可见性描述public在合约内和合约外都可以被访问,即合约内外部都可以调用该函数。这种类型的函数可以被合约内和合约外的任何地址调用。private只有在当前合约内可以被访问,即只有合约内可以调用该函数。这种类型的函数只能在合约内部被调用。exter…...

智能家居项目(三)之框架设计及框架代码文件工程建立

目录 一、智能家居项目框架设计草图 二、框架代码文件工程建立 三、添加声音识别模块的串口读取功能 一、智能家居项目框架设计草图 代码思路讲解: 1、一个指令工厂,一个控制工厂,实际上就是通过链表链起来的数据。具体怎么链接起来&…...

全网最全的Ansible中常用模块讲解

目录 前言 一、ansible实现管理的方式 二、Ad-Hoc执行方式中如何获得帮助 三、ansible命令运行方式及常用参数 四、ansible的基本颜色代表信 五、ansible中的常用模块 1、command 2、shell 3、script 4、copy 5、fetch 6、file 7、 unarchive 8、archive 9、h…...

linux程序分析工具

嵌入式调试工具1. nm2. addr2line3. readelf3.1 ELF 文件分类3.2 ELF文件组成3.3使用1. nm nm源于name,是linux下一个文本分析工具,可以罗列指定文件中的符号(函数名、变量,以及符号类型)。 nm命令参数如下: 用法:nm …...

Python3,2分钟掌握Doscoart库,你也能成为艺术家。

2行代码绘制水彩画1、引言2、 代码实战2.1 模块介绍2.2 模块安装2.3 代码示例2.3.1 创建默认图片2.3.2 设置参数创建图片2.3.3 查看设置参数2.3.4 查看配置2.3.5 保存配置2.3.6 加载配置2.3.7 导出配置文件2.3.7 生成Python代码2.3.8 调用文档3、总结1、引言 小屌丝&#xff1…...

1225057-68-0,Alkyne PEG4 TAMRA-5,四甲基罗丹明-四聚乙二醇-炔基TAMRA红色荧光染料连接剂

中英文别名:CAS号:1225057-68-0 | 英文名:5-TAMRA-PEG4-Alkyne |中文名:5-四甲基罗丹明-四聚乙二醇-炔基物理参数:CASNumber:1225057-68-0Molecular formula:C36H41N3O8Molecular weight&#x…...

Ae:解释素材

所谓解释素材 Interpret Footage,就是通过修改素材的某些属性(像素长宽比、帧速率、颜色配置文件及 Alpha 通道类型等),让它能更好地参与到合成中去。Ae菜单:文件/解释素材快捷键:Ctrl Alt G在项目面板里…...

无文件攻击

无文件攻击是一种高级持续性威胁(APT)的攻击方式,它不会在目标系统的磁盘上留下可执行文件,而是利用系统内置的工具或脚本执行恶意代码,从而绕过传统的安全防护措施。无文件攻击的最大特点就是恶意代码直接在内存中运行…...

JS高级——数据类型

数据类型 基本类型 String: 任意字符串Number: 任意的数字boolean: true/falseundefined: undefinednull: null 对象类型 Object: 任意对象Function 一种特别的对象(可以执行)Array: 一种特别的对象 判断 typeof //不能区分数组与对象、null与obje…...

场景案例│数字员工在银行业的典型应用场景,效率及准确率“双高”

伴随数字经济的高速发展,企业数字化转型步伐不断加快,银行内部信息系统越趋复杂,业务处理的自动化及智能化需求日益旺盛。调查显示,数字员工为60~75%的银行流程带来约30~40%的效能提升,能够全面帮助银行在各场景流程中…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制,因此这个了16进制的数据既可以翻译成为这个机器码,也可以翻译成为这个国标码,所以这个时候很容易会出现这个歧义的情况; 因此,我们的这个国…...

7.4.分块查找

一.分块查找的算法思想: 1.实例: 以上述图片的顺序表为例, 该顺序表的数据元素从整体来看是乱序的,但如果把这些数据元素分成一块一块的小区间, 第一个区间[0,1]索引上的数据元素都是小于等于10的, 第二…...

Vue3 + Element Plus + TypeScript中el-transfer穿梭框组件使用详解及示例

使用详解 Element Plus 的 el-transfer 组件是一个强大的穿梭框组件,常用于在两个集合之间进行数据转移,如权限分配、数据选择等场景。下面我将详细介绍其用法并提供一个完整示例。 核心特性与用法 基本属性 v-model:绑定右侧列表的值&…...

【2025年】解决Burpsuite抓不到https包的问题

环境:windows11 burpsuite:2025.5 在抓取https网站时,burpsuite抓取不到https数据包,只显示: 解决该问题只需如下三个步骤: 1、浏览器中访问 http://burp 2、下载 CA certificate 证书 3、在设置--隐私与安全--…...

css3笔记 (1) 自用

outline: none 用于移除元素获得焦点时默认的轮廓线 broder:0 用于移除边框 font-size&#xff1a;0 用于设置字体不显示 list-style: none 消除<li> 标签默认样式 margin: xx auto 版心居中 width:100% 通栏 vertical-align 作用于行内元素 / 表格单元格&#xff…...

Element Plus 表单(el-form)中关于正整数输入的校验规则

目录 1 单个正整数输入1.1 模板1.2 校验规则 2 两个正整数输入&#xff08;联动&#xff09;2.1 模板2.2 校验规则2.3 CSS 1 单个正整数输入 1.1 模板 <el-formref"formRef":model"formData":rules"formRules"label-width"150px"…...

初学 pytest 记录

安装 pip install pytest用例可以是函数也可以是类中的方法 def test_func():print()class TestAdd: # def __init__(self): 在 pytest 中不可以使用__init__方法 # self.cc 12345 pytest.mark.api def test_str(self):res add(1, 2)assert res 12def test_int(self):r…...

ABAP设计模式之---“简单设计原则(Simple Design)”

“Simple Design”&#xff08;简单设计&#xff09;是软件开发中的一个重要理念&#xff0c;倡导以最简单的方式实现软件功能&#xff0c;以确保代码清晰易懂、易维护&#xff0c;并在项目需求变化时能够快速适应。 其核心目标是避免复杂和过度设计&#xff0c;遵循“让事情保…...

LangChain知识库管理后端接口:数据库操作详解—— 构建本地知识库系统的基础《二》

这段 Python 代码是一个完整的 知识库数据库操作模块&#xff0c;用于对本地知识库系统中的知识库进行增删改查&#xff08;CRUD&#xff09;操作。它基于 SQLAlchemy ORM 框架 和一个自定义的装饰器 with_session 实现数据库会话管理。 &#x1f4d8; 一、整体功能概述 该模块…...

[免费]微信小程序问卷调查系统(SpringBoot后端+Vue管理端)【论文+源码+SQL脚本】

大家好&#xff0c;我是java1234_小锋老师&#xff0c;看到一个不错的微信小程序问卷调查系统(SpringBoot后端Vue管理端)【论文源码SQL脚本】&#xff0c;分享下哈。 项目视频演示 【免费】微信小程序问卷调查系统(SpringBoot后端Vue管理端) Java毕业设计_哔哩哔哩_bilibili 项…...