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

    文章

    11854

    浏览量

    219833
  • 鸿蒙
    +关注

    关注

    60

    文章

    3060

    浏览量

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

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    2小时搞定鸿蒙应用!零基础做出你的鸿蒙“处女作”

    的《HarmonyOS 应用开发快速入门》,直接打破零基础与开发之间的壁垒,不用具备任何开发经验,2小时就能做出专业程序员才能完成的轻应用,让普通人也能轻松拥有自己的鸿蒙作品。 本次教程选择将手持弹幕作为实战案例,它不是枯燥
    的头像 发表于 04-17 14:04 191次阅读
    <b class='flag-5'>2</b>小时搞定<b class='flag-5'>鸿蒙</b>应用!零基础做出你的<b class='flag-5'>鸿蒙</b>“处女作”

    Vue3 + React18 + TS4入门到实战 系统学习3大热门技术 | 更新完结

    Vue3 + React18 + TS4入门到实战 系统学习3大热门技术 | 更新完结 前端技术升级:Vue3新特性+React18并发+TS4类型精讲 前端开发领域正经历着一场深刻的技术变革
    发表于 03-30 15:18

    基于凌羽派的OpenHarmony北向应用开发:ArkTS语法-数据类型和变量声明

    一、简介ArkTS是一种设计用于构建高性能应用的编程语言。它在继承TypeScript语法的基础上进行了优化,以提供更高的性能和开发效率。环境配置如下所示:API:18SDK:OpenHarmony-v5.1.0-Release
    的头像 发表于 02-26 13:55 491次阅读
    基于凌羽派的OpenHarmony北向应用开发:ArkTS语法-数据类型和变量声明

    从架构到驱动:这三本经典书,承包了我的嵌入式Linux入门与进阶

    私房菜(基础学习篇 第四版)》《Linux 设备驱动开发( 2 版)》,这三本书恰好构成了从 “底层架构” 到 “系统基础” 再到 “驱动开发” 的完整学习链路。
    的头像 发表于 02-09 17:02 1471次阅读

    以实践赴热爱:我在深圳技术大学的开源鸿蒙成长之旅

    从对开源技术一知半解的入门者,到能够独立参与开源项目、斩获竞赛奖项的实践者,开源鸿蒙不仅打开了技术探索的大门,更重塑了学习方式与职业认知。 在学校搭建的多梯度开源培养体系中,深圳技术大学开源鸿
    的头像 发表于 02-04 11:06 546次阅读
    以实践赴热爱:我在深圳技术大学的开源<b class='flag-5'>鸿蒙</b>成长之旅

    AT32开源鸿蒙开发环境搭建

    本帖最后由 jf_77210199 于 2026-1-19 09:49 编辑 AT32开源鸿蒙开发环境搭建 主要介绍两部分内容: 1、如何快速搭建起开源鸿蒙的开发环境。 2、如何获取
    发表于 01-16 13:56

    鸿蒙生态·星光学堂鸿蒙应用开发者培训1期(长沙)成功举办!政企协同共育鸿蒙人才,助力区域数字产业

    1月9日,鸿蒙生态·星光学堂——鸿蒙应用开发者培训1期在长沙经开区正式开班。本次培训在长沙经开区管委会党建工作局的指导下,由鸿蒙生态(长沙)创新中心主办,
    的头像 发表于 01-12 18:03 637次阅读
    <b class='flag-5'>鸿蒙</b>生态·星光学堂<b class='flag-5'>鸿蒙</b>应用开发者培训<b class='flag-5'>第</b>1期(长沙)成功举办!政企协同共育<b class='flag-5'>鸿蒙</b>人才,助力区域数字产业

    学习RTOS的意义?

    秀的计算机大拿的智慧结晶,从中可以受益无穷。 3. 嵌入式Linux Linux是目前应用最广泛的操作系统,也是众多知名操作系统的根基,比如安卓、鸿蒙等。 打好嵌入式Linux基础,即使后续基于其他操作系统开发软件,也可触类旁通,对新技术快速入门
    发表于 11-27 08:16

    【书籍评测活动NO.67】成为硬核Linux开发者:《Linux 设备驱动开发( 2 版)》

    ,助力读者学习后能独立完成驱动程序开发。结语在当前人工智能与物联网紧密结合的AIoT时代,各类传感器、可穿戴设备要在低功耗状态下承载智能计算,高效的驱动程序是关键环节。《Linux 设备驱动开发( 2
    发表于 11-17 17:52

    学习物联网怎么入门?

    景等。同时,学习物联网的基本技术,如传感器技术、通信技术、云计算等,也是非常重要的。 其次,选择适合自己的学习方式也是入门学习物联网的重要一步。
    发表于 10-14 10:34

    达实智能34期智慧空间学习研讨会圆满举办

    2025年9月18日,由达实智能主办的34期“共创可体验的智慧空间”学习研讨会于深圳总部达实大厦圆满举办,来自安居集团、晨光乳业、华润、金蝶、京东健康、南方电网、南山医院、欧华国际、TCL、西门子医疗、中广核、中海地产、中集集团、重投
    的头像 发表于 09-22 16:02 1102次阅读

    【 HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解

    【 HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、前言:移动开发
    的头像 发表于 07-07 11:57 1262次阅读
    【 HarmonyOS 5 <b class='flag-5'>入门</b>系列 】<b class='flag-5'>鸿蒙</b>HarmonyOS示例项目讲解

    鸿蒙开发如何显示Markdown格式语法 -- markdown_hm介绍

    (> 引用文本) - 左侧蓝色竖线,斜体效果 ✅ 表格渲染 (| 表头 | 表头 |) - 完整表格,带边框和交替行色 使用方法 安装 1. 导入渲染器 import
    发表于 06-30 18:47

    HarmonyOS入门指南

    OpenHarmony三方库中心仓 坚果派 童长老仓库中心 鸿蒙宝典 一本快速学习鸿蒙的电子书 promises-book JavaScript Promise迷你书。 harmony-utils 一款功能丰富且极易
    的头像 发表于 06-27 00:11 969次阅读

    鸿蒙NEXT上传图片功能PhotoViewPicker核心功能解析

    PhotoViewPicker 的使用流程主要分为三步: 1. 创建实例 2. 配置参数 3. 启动选择器获取结果 以下是最基本的使用示例: ```typescript import
    发表于 06-06 15:00