TypeScript 后端开发中的热重载编译处理

news2025/1/7 12:53:55

在一些除了nest框架外的一些其他nodejs框架中没有提供对ts编译和热重载,如果使用typescript我们需要自己进行配置。

方法一(推荐)

使用bun运行环境(快)。注:一些不是使用js,ts代码编写的第三方包,可能会有兼容性问题。

bun run --hot index.ts

构建为js代码 

bun build index.ts --target node --outdir ./dist

编译成可执行文件

bun build --compile --minify index.ts --outfile ./dist/web

方法二(推荐)

使用deno运行环境(安全) 。deno2.x和bun有同样兼容性问题,deno1.x兼容性更差。

deno run --allow-net --watch ./src/index.ts 

 编译成可执行文件

deno compile --output ./dist/app --allow-net --allow-read ./src/index.ts

 方法三(推荐)

使用 ts-node-dev,npm i ts-node-dev安装。

ts-node-dev --respawn --transpile-only src/index.ts

方法四 

使用tsc配置增量编译,配合concurrently 实现。

tsconfig.json

{
  "compilerOptions": {
    "target": "es2016", // 输出目标 JavaScript 版本
    "module": "CommonJS", // 使用 ES 模块
    "experimentalDecorators": true, /* Enable experimental support for TC39 stage 2 draft decorators. */
    "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */
    "lib": [
      "ES2016",
      "DOM"
    ],
    "moduleResolution": "node", // 使用 Node.js 模块解析策略
    "outDir": "./dist", // 输出目录
    "rootDir": "./src/", // TypeScript 源代码目录
    "baseUrl": "./", // 设置模块解析的基本路径
    "resolveJsonModule": true, // 支持导入 JSON 文件
    // "emitDeclarationOnly": false, // 只生成声明文件
    "allowJs": true, // 允许导入 JS 文件
    "checkJs": true,
    "sourceMap": true,
    "importHelpers": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true, // 支持与 CommonJS 模块互操作
    "strict": true, // 启用严格模式
    "listEmittedFiles": true, // 打印输出文件
    "listFiles": true,
    "declaration": false, 
    "composite": false, // 启用增量构建
    "incremental": true, // 启用增量编译
    "tsBuildInfoFile": "./.tsbuildinfo", // 增量编译信息文件
    "skipLibCheck": true, // 跳过库类型检查
    "forceConsistentCasingInFileNames": true, // 强制文件名大小写一致
    "paths": {
      "*": [
        "node_modules/*"
      ] // 配置模块路径
    }
  },
  "include": [
    "src/**/*" // 包含所有 src 目录下的文件
  ],
  "exclude": [
    "node_modules" // 排除 node_modules 目录
  ]
}

package.json

"a": "concurrently \"npm run c\" \"npm run n\"",
"c": "tsc --watch",
"n": "nodemon --exec node ./dist/bin/www.js --watch ./src --ext ts --legacy-watch",
    

其它方法 

 也可以使用webpack、vite、gulp等一些构建工具实现,不是很推荐。

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

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

相关文章

xml格式化(3):增加头部声明

前言 这篇文章&#xff0c;是用来增加头部声明。 正文 from lxml import etreedef pretty_print(element, level0, indent" "):result ""# 判断元素是否为注释节点if isinstance(element, etree._Comment):result f"{indent * level}<!--{el…

STM32 高级 物联网通讯之LoRa通讯

目录 LoRa通讯基础知识 常见的3种通讯协议 远距离高速率的传输协议 近距离高速率传输技术 近距离低功耗传输技术 低功耗广域网 采用授权频段技术 非授权频段 LoRa简介 LoRa的特点 远距离 低功耗 安全 标准化 地理定位 移动性 高性能 低成本 LoRa应用 LoRa组…

【FlutterDart】 拖动改变 widget 的窗口尺寸大小GestureDetector~简单实现(10 /100)

上效果 预期的是通过拖动一条边界线改变窗口大小&#xff0c;类似vscode里拖动效果。这个是简单的拖动实现 上代码&#xff1a; import package:flutter/material.dart;class MyDraggableViewDemo extends StatelessWidget {const MyDraggableViewDemo({super.key});override…

Luma AI 简单几步生成视频

简单几步生成视频 登录我们的 AceDataPlatform 网站&#xff0c;按照下图所示即可生成高质量的视频&#xff0c;同时&#xff0c;我们也提供了简单易用的 API 方便集成调用&#xff0c;可以查看 Luma API了解详情 技术介绍 我们使用了 Luma 的技术&#xff0c;实现了上面的图…

如何免费解锁 IPhone 网络

您是否担心 iPhone 上的网络锁定&#xff1f;如果您的 iPhone 被锁定到特定运营商&#xff0c;解锁它可以连接到不同的运营商。好吧&#xff0c;我们为您准备了一份指南。 iPhone运营商免费解锁将是小菜一碟。在我们的解锁运营商 iphone 免费指南中。我们为您提供了一份简介&am…

[读书日志]8051软核处理器设计实战(基于FPGA)第三篇:8051 keil编程配置 C语言开发流程 中断程序实例

第一篇https://blog.csdn.net/m0_74021449/article/details/144796689 第二篇https://blog.csdn.net/m0_74021449/article/details/144813103 3.8051中断与keil开发流程 3.1 keil的下载与概述 关于keil&#xff0c;大家都并不陌生&#xff0c;它是开发51单片机和ARM架构的32…

音视频-----RTSP协议 音视频编解码

流媒体协议详解&#xff1a;RTSP、RTP、RTCP、SIP、SDP、RTMP、WebRTC、WebSocket-CSDN博客 上文讲解比较清楚 多媒体编解码基础知识 一文详解WebRTC、RTSP、RTMP、SRT-腾讯云开发者社区-腾讯云 RTP :(Real-time Transport Protocol)是用于Internet上针对多媒体数据流的一种传…

Nginx代理本地exe服务http为https

Nginx代理本地exe服务http为https 下载NginxNginx命令exe服务http代理为https 下载Nginx 点击下载Nginx 下载好之后是一个压缩包&#xff0c;解压放到没有中文的路径下就可以了 Nginx命令 调出cmd窗口cd到安装路径 输入&#xff1a;nginx -v 查看版本 nginx -h&#xff…

《Vue3实战教程》40:Vue3安全

如果您有疑问&#xff0c;请观看视频教程《Vue3实战教程》 安全​ 报告漏洞​ 当一个漏洞被上报时&#xff0c;它会立刻成为我们最关心的问题&#xff0c;会有全职的贡献者暂时搁置其他所有任务来解决这个问题。如需报告漏洞&#xff0c;请发送电子邮件至 securityvuejs.org。…

【Go学习】-01-6-数据库泛型新特性

【Go学习】-01-6-数据库泛型新特性 1 数据库操作1.1 操作mysql1.1.1 Insert1.1.2 Select1.1.3 Update1.1.4 Delete1.1.5 sql事务 1.2 go操作Redis 2 泛型2.1 非泛型函数2.2 泛型函数2.3 泛型类型2.3.1 泛型结构体2.3.2 泛型接口 2.4 泛型约束2.5 泛型切片和映射2.5.1 泛型切片2…

STM32-笔记20-测量按键按下时间

1、按键按下的时间-思路 我们先检测下降沿信号&#xff0c;检测到以后&#xff0c;在回调函数里切换成检测上升沿信号&#xff0c;当两个信号都检测到的时候&#xff0c;这段时间就是按键按下的时间&#xff0c;如图所示&#xff1a;>N*(ARR1)CCRx的值 N是在这段时间内&…

【数据结构-堆】力扣2530. 执行 K 次操作后的最大分数

给你一个下标从 0 开始的整数数组 nums 和一个整数 k 。你的 起始分数 为 0 。 在一步 操作 中&#xff1a; 选出一个满足 0 < i < nums.length 的下标 i &#xff0c; 将你的 分数 增加 nums[i] &#xff0c;并且 将 nums[i] 替换为 ceil(nums[i] / 3) 。 返回在 恰好…

软件逆向之标志位

进位标志CF&#xff08;Carry Flag&#xff09; 介绍&#xff1a;如果运算结果的最高位产生了一个进位&#xff08;加法&#xff09;或借位&#xff08;减法&#xff09;&#xff0c;那么&#xff0c;其值为1&#xff0c;否则其值为0。无符号数。 示例&#xff1a; mov al&…

api接口技术开发系列如何调用电商平台的按图搜索商品API?

不同电商平台的按图搜索商品 API 调用方法大致相似&#xff0c;以下是一般的调用步骤&#xff1a; 注册与获取权限 注册账号&#xff1a;在相应的电商开放平台注册成为开发者&#xff0c;如淘宝平台、1688 平台等。创建应用&#xff1a;登录后创建应用&#xff0c;填写应用的相…

【Seed-Labs 2.0】Buffer Overflow Attack Lab (Server Version)

说在前面 实验总述 缓冲区溢出是指程序试图写入超出缓冲区边界的数据。恶意用户可利用这一漏洞改变程序的流控制&#xff0c;从而导致恶意代码的执行。本实验的目的是让学生从实践中了解这种类型的漏洞&#xff0c;并学习如何在攻击中利用这种漏洞。 在本实验中&#xff0c;…

WPS表格技巧01-项目管理中的基本功能-计划和每日记录的对应

前言&#xff1a; 在项目管理中&#xff0c;一般就是用些项目管理工具来管理这个任务和 task&#xff0c;但是就是要学这些工具很麻烦&#xff0c;比较好的方法&#xff0c;通用的方法就是用 Excel 表格去做&#xff08;这非常适合松散的团队组织&#xff09;&#xff0c;然后…

SpringBoot入门之创建一个Hello World项目

文章目录 一、使用传统的方式1、创建一个SpringBoot项目2、配置pom.xml文件3、下载Maven依赖4、创建一个Controller类&#xff1a;com.devops.controller.HelloController5、创建一个引导类&#xff1a;com.devops.HelloApplication6、启动项目8、访问80809、完整项目结构 二、…

机器学习笔记 - 单幅图像深度估计的最新技术

1、深度估计简述 单眼深度估计是一项计算机视觉任务,AI 模型从单个图像中预测场景的深度信息。模型估计场景中对象从一个照相机视点的距离。单目深度估计已广泛用于自动驾驶、机器人等领域。深度估计被认为是最困难的计算机视觉任务之一,因为它要求模型理解对象及其深度信息之…

探索AI在地质科研绘图中的应用:ChatGPT与Midjourney绘图流程与效果对比

文章目录 个人感受一、AI绘图流程1.1 Midjourney&#xff08;1&#xff09;环境配置&#xff08;2&#xff09;生成prompt&#xff08;3&#xff09;完善prompt&#xff08;4&#xff09;开始绘图&#xff08;5&#xff09;后处理 1.2 ChatGPT不合理的出图结果解决方案 二、主题…

HTML——28.音频的引入

<!DOCTYPE html> <html><head><meta charset"UTF-8"><title>音频引入</title></head><body><!--audio:在网页中引入音频当属性名和属性值一样&#xff0c;可以只写属性名src属性:指定音频文件路径&#xff0c;必…