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

【黑马程序员】2、TypeScript介绍_黑马程序员前端TypeScript教程,TypeScript零基础入门到实战全套教程

课程地址:【黑马程序员前端TypeScript教程,TypeScript零基础入门到实战全套教程】 https://www.bilibili.com/video/BV14Z4y1u7pi/?share_source=copy_web&vd_source=b1cb921b73fe3808550eaf2224d1c155

目录

 2、TypeScript初体验

2.1 安装编译TS的工具包                                

2.2 TypeScript初体验

2.3 简化TS运行的步骤


 2、TypeScript初体验

2.1 安装编译TS的工具包                                

安装步骤

  1. 下载Node.js   Node.js是一个开源跨平台的JavaScript运行时环境。

    • 64位:https://nodejs.org/dist/v14.15.1/node-v14.15.1-x64.msi

    • 32位:https://nodejs.org/dist/v14.15.1/node-v14.15.1-x86.msi

  2. 安装Node.js  判断是否安装成功  cmd里 node -v

     Node.js是为了使用TS编译器,接下来安装TS编译器

  3. 使用npm全局安装typescript      npm是Node.js的包管理器,通过npm可以安装Node下面各种各样的软件和应用,其中TS解析器就是这样的软件。(装好Node的时候npm已经装好了)

    • 进入命令行

    • 输入:npm i -g typescript  

      显示安装成功,tsc命令 

  4. 创建一个ts文件

  5. 使用tsc对ts文件进行编译  (网页不认ts文件,这里要使用编译器将ts文件转换成js文件)

    • 进入命令行

    • 进入ts文件所在目录

    • 执行命令:tsc xxx.ts 

      没有消息证明编译通过,代码没有问题。 

      得到的js文件,是可以在浏览器里执行。 

2.2 TypeScript初体验

编译并运行ts代码

1、创建ts文件;

2、ts编译为js:在终端输入命令:tsc  文件名.ts

选择将ts文件在终端打开。 

输入命令

 3、执行js代码:在终端输入命令: node 文件名.js

输入node命令,得到结果

所有合法的JS代码都是TS代码。

由TS编译生成的JS文件,代码没有类型信息。

2.3 简化TS运行的步骤

问题:每次都要先生成js,然后执行js

简化方式:使用ts-node包,直接在Node.js中执行TS代码

 按照视频来会报错,出现问题是ts-node版本太新了,解决方法参见使用ts-node demo.ts命令报错_阿妖呀的博客-CSDN博客

结果 

相关文章:

  • 【论文精读】ConvNeXt
  • 2.26作业
  • Kafka3.x进阶
  • 百亿大佬南存辉瞄准光伏板块,正泰电器分拆正泰安能上市
  • Android的LiveData
  • 机器学习理论知识学习
  • 化学分子Mol2文件格式与使用注意事项
  • vue-element-admin如何绕开系统的请求的路由,使用静态路由
  • 【GameFramework框架内置模块】4、内置模块之调试器(Debugger)
  • https://htmlunit.sourceforge.io/
  • SpringBoot快速入门(黑马学习笔记)
  • Vue.js+SpringBoot开发超市商品管理系统
  • 基于Springboot + Vue 母婴商城系统
  • SQL库操作
  • Mac使用K6工具压测WebSocket
  • 【159天】尚学堂高琪Java300集视频精华笔记(128)
  • 【Amaple教程】5. 插件
  • 【跃迁之路】【463天】刻意练习系列222(2018.05.14)
  • JavaScript 基础知识 - 入门篇(一)
  • java小心机(3)| 浅析finalize()
  • JS 面试题总结
  • python 装饰器(一)
  • Python3爬取英雄联盟英雄皮肤大图
  • React Transition Group -- Transition 组件
  • React-Native - 收藏集 - 掘金
  • scala基础语法(二)
  • Spark in action on Kubernetes - Playground搭建与架构浅析
  • Transformer-XL: Unleashing the Potential of Attention Models
  • Vue全家桶实现一个Web App
  • 入口文件开始,分析Vue源码实现
  • 设计模式 开闭原则
  • 通过获取异步加载JS文件进度实现一个canvas环形loading图
  • 推荐一个React的管理后台框架
  • 消息队列系列二(IOT中消息队列的应用)
  • 协程
  • ionic异常记录
  • Play Store发现SimBad恶意软件,1.5亿Android用户成受害者 ...
  • 好程序员web前端教程分享CSS不同元素margin的计算 ...
  • 没有任何编程基础可以直接学习python语言吗?学会后能够做什么? ...
  • 数据库巡检项
  • 说说我为什么看好Spring Cloud Alibaba
  • ​​​​​​​​​​​​​​汽车网络信息安全分析方法论
  • ​linux启动进程的方式
  • ​草莓熊python turtle绘图代码(玫瑰花版)附源代码
  • (1)(1.13) SiK无线电高级配置(六)
  • (16)UiBot:智能化软件机器人(以头歌抓取课程数据为例)
  • (3)(3.2) MAVLink2数据包签名(安全)
  • (八)Docker网络跨主机通讯vxlan和vlan
  • (附源码)基于SpringBoot和Vue的厨到家服务平台的设计与实现 毕业设计 063133
  • (强烈推荐)移动端音视频从零到上手(下)
  • (生成器)yield与(迭代器)generator
  • (转载)VS2010/MFC编程入门之三十四(菜单:VS2010菜单资源详解)
  • .describe() python_Python-Win32com-Excel
  • .gitignore文件_Git:.gitignore
  • .NET / MSBuild 扩展编译时什么时候用 BeforeTargets / AfterTargets 什么时候用 DependsOnTargets?