node 如何运行typescript

news2024/12/23 18:32:21

文章目录

  • node 如何运行typescript
    • 手工编译 TypeScript 然后运行 JavaScript
    • 使用 ts-node
    • 创建一个typescript node项目
    • tsconfig.json

node 如何运行typescript

在 Node.js 中运行 TypeScript 代码有几种常见的方法,以下是其中几种。

手工编译 TypeScript 然后运行 JavaScript

这种方法需要先将 TypeScript 代码编译为 JavaScript,然后再使用 Node.js 运行 JavaScript 文件。

a. 安装 TypeScript 依赖:

npm install -g typescript

b. 编译 TypeScript 文件:

tsc your-typescript-file.ts

c. 运行生成的 JavaScript 文件:

node your-javascript-file.js

使用 ts-node

安装 ts-node 开发依赖:

npm install --save-dev ts-node

或者使用 Yarn:

yarn add --dev ts-node

使用 ts-node 可以大大提高开发效率,因为无需手动编译 TypeScript 文件,可以直接运行。这在开发阶段非常有用。
但是在生产环境中,仍然建议使用 node 命令运行经过编译的 JavaScript 文件,因为 ts-node 在运行时需要执行编译过程,会影响性能。

ts-node 更适合用于开发和调试阶段,而 node 更适合用于生产环境中运行已经编译好的 JavaScript 代码。在开发过程中,使用 ts-node 可以提高工作效率,而在部署时使用 node 可以获得更好的性能。
在这里插入图片描述
我们添加了一个名为 dev 的新脚本,它使用 ts-node 命令运行您的 TypeScript 入口文件 src/app.ts

当您在命令行中运行 npm run dev 时,就会启动您的 TypeScript 应用程序,并且无需手动编译 TypeScript 文件。这在开发阶段非常有助于提高工作效率。

创建一个typescript node项目

  1. 运行 npm init -y 命令,这将在当前目录下创建一个 package.json 文件。
  2. 运行 npm install --save-dev typescript 命令,将 TypeScript 安装为开发依赖。
  3. 创建 tsconfig.json 文件:
    在项目根目录下运行 npx tsc --init 命令,这将创建一个tsconfig.json 文件,用于配置 TypeScript 编译器。
  4. 创建 src 目录并编写 TypeScript 代码:
    在项目根目录下创建一个 src 目录,用于存放你的 TypeScript 源代码文件。
    在 src 目录下创建一个新文件,例如 app.ts,并编写你的 TypeScript 代码。
  5. 配置 package.json 文件:
    在 package.json 文件的 scripts 部分,添加以下脚本
"scripts": {
  "build": "tsc",
  "start": "node dist/app.js"
}

“build” 脚本用于编译 TypeScript 代码,“start” 脚本用于运行编译后的 JavaScript 代码。

通过在 package.json 文件中添加脚本,可以方便地使用 npm 命令进行编译和运行:

npm run build
npm start

npm run build: 运行 TypeScript 编译器,将 TypeScript 代码编译为 JavaScript 代码。
npm start: 运行编译后的 JavaScript 代码,启动 Node.js 应用程序。

Node.js 应用程序使用 TypeScript 。主要的变化包括:

  • 添加 tsconfig.json 文件,配置 TypeScript 编译器选项。
  • 将文件扩展名改为 .ts。
  • 修改导入语句,使用 TypeScript 的导入语法。
  • 使用 TypeScript 语法,为变量和函数添加类型注解。
  • 更新 package.json 文件中的 scripts 部分,以便使用 TypeScript 编译器进行构建和运行。

这样,你就可以在 TypeScript 环境下继续开发和维护你的 Node.js 应用程序了

tsconfig.json

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig to read more about this file */

   /* Language and Environment */
    "target": "es2016",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */

    /* Modules */
    "module": "commonjs",                                /* Specify what module code is generated. */
    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */

    /* Type Checking */
    "strict": true,                                      /* Enable all strict type-checking options. */

    /* Completeness */
    // 跳过对引入库的类型检查
    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
    "skipLibCheck": true,
    "outDir": "dist",
  }
}

tsconfig.json 文件中如果没有指定 outDir 选项,这意味着编译器不会将 JavaScript 文件输出到任何特定的目录。
"include": ["src/**/*"] 选项,将 src 目录下的所有 TypeScript 文件包括进来。tsconfig.json 文件中没有指定 include 或 files 选项,这意味着编译器不知道哪些 TypeScript 文件需要编译。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1928086.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Docker---最详细的服务部署案例

提供python服务的docker一键部署,示例已配置负载均衡,不需要的在nginx.conf和docker-compose注释相关代码即可 文件结构 1、dockerfile # 服务的dockerfile# 服务依赖的镜像 FROM python:3.7# 设置容器内服务的工作目录 WORKDIR /app# 复制当前文件夹所…

数据库-三范式

第一范式 1 数据库所有字段都只有单一属性。 2 单一属性由基本数据类型构成。 3 数据库的表都是二维的行与列。 例如上面的例子就不满足第一范式,因为是可以继续拆分的,拆分为更多的属性。 第二范式 1 符合第一范式 2 表必须有个主建 3 其它字段可以…

企业网络运维-给华为交换机配置sftp,浏览交换机文件并下载上传

文章目录 需求实验开户stelnet权限已完成stelnet账号下的sftp配置使用xshell-sftp访问 需求 浏览交换机文件并下载上传 实验 开户stelnet权限 参考https://blog.csdn.net/xzzteach/article/details/140419150 已完成stelnet账号下的sftp配置 服务类型all包括stelnet和sf…

SadTalker数字人服务器部署

一、单独SadTalker部署 git clone https://github.com/OpenTalker/SadTalker.gitcd SadTalker conda create -n sadtalker python3.8conda activate sadtalkerpip install torch1.12.1cu113 torchvision0.13.1cu113 torchaudio0.12.1 --extra-index-url https://download.pyto…

NSSCTF中24网安培训day2中web题目

[SWPUCTF 2021 新生赛]ez_unserialize 这道题目考察php反序列化的知识点 打开题目,发现没有提示,我们试着用御剑扫描目录文件,发现存在robots.txt的文件 接着访问这个文件,发现是一段php反序列化代码,我们需要进行序…

[Windows] 油.管视频下载神器 Gihosoft TubeGet Pro v9.3.88

描述 对于经常在互联网上进行操作的学生,白领等! 一款好用的软件总是能得心应手,事半功倍。 今天给大家带了一款高科技软件 管视频下载神器 无需额外付费,永久免费! 亲测可运行!! 内容 目前主…

【B树、B-树、B+树】

目录 一、B-树(即B树)的定义及操作1.1、定义1.2、操作1.2.1、查找1.2.2、插入1.2.3、删除 二、B树的定义及操作2.1、定义2.2、操作2.2.1、查找2.2.2、插入2.2.3、删除 一、B-树(即B树)的定义及操作 1.1、定义 B-tree即B树&#…

jmeter-beanshell学习10-字符串补齐位数

每天都遇到新问题,今天又一个场景,一个字符串,如果不足11位,则左边补0,补够11位。 先要获取字符串长度,然后计算差多少位,补齐。今天又发现一个Object类型,这个类型有点厉害&#x…

uniapp启动图延时效果,启动图的配置

今天阐述uniapp开发中给启动图做延迟效果,不然启动图太快了,一闪就过去了; 一:修改配置文件:manifest.json "app-plus" : {"splashscreen" : {"alwaysShowBeforeRender" : false,"…

dhtmlx-gantt甘特图数据展示

官网文档&#xff1a;甘特图文档 实现效果&#xff1a; 首先需要下载 dhtmlx-gantt组件 npm i dhtmlx-gantt //我项目中使用的是"dhtmlx-gantt": "^8.0.6" 这个版本&#xff0c;不同的版本api或是文档中存在的方法稍有差异 界面引用 <template>&l…

二叉搜索树的实现[C++]

文章目录 搜索二叉树概念二叉搜索树的功能查找 实现搜索二叉树节点的定义建立搜索二叉树接口插入搜索打印删除 总结 今天本堂主来一起讨论下什么是搜索二叉树&#xff0c;和如何实现二叉搜索树 搜索二叉树 那么二叉搜索树似乎如何实现搜索呢&#xff1f;二叉搜索树和普通二叉…

PNPM 高效入门:安装配置一本通

PNPM高效入门&#xff1a;安装配置一本通 引言Pnpm 简介安装 PNPM全局安装&#xff08;推荐&#xff09;使用 nvm&#xff08;Node Version Manager&#xff09; 配置PNPM使用PNPM管理项目初始化项目 添加依赖快速安装所有依赖查看安装的包 优化与故障排除PNPM与持续集成/持续部…

nacos 适配瀚高数据库、ARM 架构

下载nacos源码: https://github.com/alibaba/nacos/tree/2.3.1 瀚高技术文档 1、修改pom.xml 根目录nacos-all => pom.xml<dependencyManagement><dependency><groupId>com.highgo</groupId><artifactId>HgdbJdbc</artifactId><…

安全防御:防火墙基本模块

目录 一、接口 1.1 物理接口 1.2 虚拟接口 二、区域 三、模式 3.1 路由模式 3.2 透明模式 3.3 旁路检测模式 3.4 混合模式 四、安全策略 五、防火墙的状态检测和会话表技术 一、接口 1.1 物理接口 三层口 --- 可以配置IP地址的接口 二层口&#xff1a; 普通二层…

linux的学习(四):磁盘,进程,定时,软件包的相关命令

简介 关于磁盘管理&#xff0c;进程管理&#xff0c;定时任务&#xff0c;软件包管理的命令的使用 磁盘管理类命令 du du 目录名&#xff1a; 查看文件和目录占用的磁盘空间 参数&#xff1a; -h&#xff1a;可以看到大小的单位&#xff0c;g,mb-a&#xff1a;还可以看到文…

Mapboxgl 生成飞行动画GIF

更多精彩内容尽在数字孪生平台&#xff0c;关注公众号【sky的数孪技术】&#xff0c;技术交流、源码下载请添加VX&#xff1a;digital_twin123 根据两点生成动画的工具。 首先&#xff0c;找到你想要开始的视图&#xff0c;点击“设置起点视图”&#xff0c;然后调整到目的视图…

Android中RecyclerView使用详解(一)

目录 概述优点列表布局RecyclerView一、创建RecyclerView并且在布局中绑定二、实现RecyclerView单个item的布局三、给RecyclerView写一个对应的适配器Adapter1.创建自定义的ViewHolder2.继承Adapter&#xff0c;泛型使用我们自定义的ViewHolder3.重写Adapter的三个方法onCreate…

如何提取视频中的音频?提取音频的几种方法

如何提取视频中的音频&#xff1f;提取视频中的音频&#xff0c;是许多人在处理多媒体内容时常遇到的需求。这一过程不仅仅是简单地从视听媒体中抽离音频部分&#xff0c;它背后蕴含着许多技术上的挑战和创意上的可能性。通过提取音频&#xff0c;你可以更方便地利用视频中的声…

网络安全——防御(防火墙)带宽以及双机热备实验

12&#xff0c;对现有网络进行改造升级&#xff0c;将当个防火墙组网改成双机热备的组网形式&#xff0c;做负载分担模式&#xff0c;游客区和DMZ区走FW3&#xff0c;生产区和办公区的流量走FW1 13&#xff0c;办公区上网用户限制流量不超过100M&#xff0c;其中销售部人员在其…

docker镜像导出与导入

布置程序出问题了&#xff0c;拉不下来镜像 程序的配置文件里面有镜像的名字 docker pull ubuntu/squid:latest 我是本地下载了镜像&#xff0c;使用本地的镜像导出 导出镜像使用 docker 导出导入镜像 要在Docker中导出和导入镜像&#xff0c;您可以使用docker save命令来导…