0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

鸿蒙TypeScript入门学习第2天【TypeScript安装】

jf_46214456 来源:jf_46214456 作者:jf_46214456 2024-03-27 15:22 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

1、TypeScript 安装

本文介绍 TypeScript 环境的安装。

我们需要使用到 npm 工具安装,如果你还不了解 npm,可以参考我之前文档。

2、NPM 安装 TypeScript

如果你的本地环境已经安装了 npm 工具,可以使用以下命令来安装。

使用国内镜像:

npm config set registry https://registry.npmmirror.com

安装 typescript:

npm install -g typescript

安装完成后我们可以使用 tsc 命令来执行 TypeScript 的相关代码,以下是查看版本号:

$ tsc -v
Version 3.2.2

然后我们新建一个 app.ts 的文件,代码如下:

var message:string = "Hello World" console.log(message)

通常我们使用 .ts 作为 TypeScript 代码文件的扩展名。

然后执行以下命令将 TypeScript 转换为 JavaScript 代码:

tsc app.ts

cke_5294.png

这时候在当前目录下(与 app.ts 同一目录)就会生成一个 app.js 文件,代码如下:

var message = "Hello World"; console.log(message);

使用 node 命令来执行 app.js 文件:

$ node app.js 
Hello World

TypeScript 转换为 JavaScript 过程如下图:

cke_9107.png


3、Visual Studio Code 介绍

很多 IDE 都有支持 TypeScript 插件,如:Visual Studio,Sublime Text 2,WebStorm / PHPStorm,Eclipse 等。

本章节主要介绍 Visual Studio Code,Visual Studio Code 是一个可以运行于 Mac OS X、Windows 和 Linux 之上的,针对于编写现代 Web 和云应用的跨平台源代码编辑器,由 Microsoft 公司开发。

鸿蒙OS开发更多内容↓点击HarmonyOSOpenHarmony技术
鸿蒙技术文档开发知识更新库gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md在这。或+mau123789学习,是v喔

搜狗高速浏览器截图20240326151547.png

4、Windows 上安装 Visual Studio Code

1、下载 [Visual Studio Code]

cke_15825.png

2、双击 VSCodeSetup.exe 图标 安装。

cke_20025.png

3、安装完成后,打开 Visual Studio Code 界面类似如下:

cke_22612.png

4、 我们可以在左侧窗口中点击当前编辑的代码文件,选择 open in command prompt (在终端中打开),这时候我们就可以在屏幕的右侧下半部分使用 tsc 命令来执行 TypeScript 文件代码了。

cke_25970.png

5、Mac OS X 安装 Visual Studio Code

Mac OS X 安装配置 Visual Studio Code 可以查看: 官网

Linux 安装 Visual Studio Code

Linux 安装配置 Visual Studio Code 可以查看:官网

审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • Linux
    +关注

    关注

    88

    文章

    11628

    浏览量

    217981
  • 鸿蒙
    +关注

    关注

    60

    文章

    2859

    浏览量

    45357
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    tscircuit - 电路开发的 React 范式​ 用TypeScript、React和 AI工具构建电子产品

    TypeScript、React 和 AI 工具构建电子产品。
    的头像 发表于 04-30 18:18 1208次阅读
    tscircuit - 电路开发的 React 范式​   用<b class='flag-5'>TypeScript</b>、React和 AI工具构建电子产品

    如何成为一名合格的KaihongOS北向应用开发工程师

    基础知识 编程语言:学习至少一种编程语言,如 JavaScript和TypeScript,这些语言是北向应用开发中必备的基础语言。 掌握开发工具: 熟悉 DevEco Studio; 学习
    发表于 04-23 06:46

    KaihongOS操作系统:ArkTS语言基础

    应用开发中使用的TypeScript超集,提供了一套丰富的API来构建应用界面和逻辑。 ArkTS与TypeScript ArkTS基于TypeScript进行扩展,因此TypeScript
    发表于 04-23 06:31

    鸿蒙北向开发OpenHarmony5.0 DevEco Studio开发工具安装与配置

    本文介绍OpenHarmony5.0 DevEco Studio开发工具安装与配置,鸿蒙北向开发入门必备!由触觉智能Purple Pi OH鸿蒙开发板演示。搭载了瑞芯微RK3566四核
    的头像 发表于 03-28 18:05 1339次阅读
    <b class='flag-5'>鸿蒙</b>北向开发OpenHarmony5.0 DevEco Studio开发工具<b class='flag-5'>安装</b>与配置

    【北京迅为】itop-3568 开发板openharmony鸿蒙烧写及测试-2章OpenHarmony v3.2-Beta4版本测试

    【北京迅为】itop-3568 开发板openharmony鸿蒙烧写及测试-2章OpenHarmony v3.2-Beta4版本测试
    的头像 发表于 03-05 10:53 883次阅读
    【北京迅为】itop-3568 开发板openharmony<b class='flag-5'>鸿蒙</b>烧写及测试-<b class='flag-5'>第</b><b class='flag-5'>2</b>章OpenHarmony v3.2-Beta4版本测试

    【「极速探索HarmonyOS NEXT 」阅读体验】 初印象:一本纯血鸿蒙应用开发入门的好书

    的整体内容有了一个比较清晰的认识。它不仅对于初学者是一本易于入门的好书,对于常开发鸿蒙应用的工作者也是一本可以日常翻阅的好手册。 清晰的文章描述,资料的详细可查,极大的激发了我极大的学习兴趣。本书还提
    发表于 03-04 12:41

    HarmonyOS 应用开发赋能套件:鸿蒙原生应用开发的 “神助攻”

    随着鸿蒙生态的快速发展,越来越多的开发者投身于鸿蒙原生应用的开发中。然而,在学习鸿蒙原生应用开发时,许多开发者仍面临一系列问题,如不清楚如何快速入门
    发表于 02-17 16:37

    鸿蒙北向开发OpenHarmony4.1 DevEco Studio开发工具安装与配置

    OpenHarmony4.1 DevEco Studio开发工具安装与配置,鸿蒙北向开发入门必备!
    的头像 发表于 02-07 17:35 1346次阅读
    <b class='flag-5'>鸿蒙</b>北向开发OpenHarmony4.1 DevEco Studio开发工具<b class='flag-5'>安装</b>与配置

    【瑞萨RA2L1入门学习2. PWM呼吸灯

    .烧录程序: 3.实验图片: 经过这两的使用,发现e2studio中的stacks页面还是挺好用的,可以拖拽函数,编写程序更加方便快捷。在stacks页面还能看到用到了哪些堆栈,非常的赞。 本人第一次使用该开发板,作为入门
    发表于 01-30 21:55

    #新年新气象,大家新年快乐!#AIGC入门鸿蒙入门

    、功能强大等特点,能够在物联网时代为用户提供更加便捷、高效的服务。 2.开发环境搭建: 下载并安装DevEco Studio,这是华为官方为鸿蒙系统开发提供的集成开发环境。 配置开发环境,包括
    发表于 01-13 10:46

    AIGC入门鸿蒙入门

    、小巧、功能强大等特点,能够在物联网时代为用户提供更加便捷、高效的服务。 2. 开发环境搭建: 下载并安装DevEco Studio,这是华为官方为鸿蒙系统开发提供的集成开发环境。 配置开发环境,包括
    发表于 01-13 10:32

    ArkTS语言基础介绍篇

    KaihongOS是一个开源的、跨设备的操作系统,它支持多种设备类型。ArkTS是KaihongOS应用开发中使用的TypeScript超集,提供了一套丰富的API来构建应用界面和逻辑。 详见资料说明!
    发表于 01-10 10:15

    如何成为一名合格的北向应用开发工程师

    语言,如 JavaScript和TypeScript,这些语言是北向应用开发中必备的基础语言。 掌握开发工具 : 熟悉 DevEco Studio; 学习如何使用 KaihongOS 的 SDK 和工具
    发表于 01-10 10:00

    OpenHarmony怎么修改DPI密度值?触觉智能RK3566鸿蒙开发板演示

    开源鸿蒙OpenHarmony系统下,修改DPI密度值的方法,触觉智能Purple Pi OH鸿蒙开发板演示,搭载了瑞芯微RK3566四核处理器,Laval鸿蒙社区推荐开发板,已适配全新开源鸿
    的头像 发表于 12-24 11:46 1082次阅读
    OpenHarmony怎么修改DPI密度值?触觉智能RK3566<b class='flag-5'>鸿蒙</b>开发板演示

    瑞萨 FPB-RA6E2 评估板入门学习

    瑞萨 FPB-RA6E2 评估板入门学习
    的头像 发表于 12-11 09:22 1243次阅读
    瑞萨 FPB-RA6E<b class='flag-5'>2</b> 评估板<b class='flag-5'>入门</b><b class='flag-5'>学习</b>