使用 ts-node 运行 ts文件,启动 nodejs项目

最近在写一个nodejs项目,使用 ts-node 启动项目。遇到了一些问题,在此记录一下。

ts-node 是 TypeScript 执行引擎和 Node.js 的 REPL(一个简单的交互式的编程环境)。

它能够直接在 Node.js 上执行 TypeScript,而无需预编译。 这是通过挂接 node 的模块加载 API 来实现的,使其能够与其他 Node.js 工具和库无缝衔接。

1. 安装:

npm i ts-node
npm i ts-node -g // 也可以全局安装

检查是否安装成功

ts-node -v

在这里插入图片描述

如果不识别该命令,以管理员身份运行 IDE 或 powershell。

2. 目录结构

|-- server_node
|   |-- src
|       |-- login
|       |   |-- index.ts
|       |-- test
|           |-- index.ts
|   |-- index.ts
|   |-- package-lock.json
|   |-- package.json

index.ts

import express from "express";import Login from "./src/login";
import Test from "./src/test";const app = express();app.use("/api", Login);
app.use("/api", Test);app.listen(9090, () => {console.log("success server http://localhost:9090");
});

3. 启动 + 排错

添加启动命令:“dev”: “ts-node index.ts”
package.json

{"name": "server_node","version": "1.0.0","description": "","main": "index.js","type": "module","scripts": {"dev": "ts-node index.ts","test": "echo \"Error: no test specified\" && exit 1"},...
}

啪的一下子,就报错了,很干脆啊!

在这里插入图片描述
这是因为 nodejs 默认支持 CommonJS语法,不识别 import 导入。有两个解决方案:

  • package.json 中添加 "type": "module"
  • ts-node index.ts 改为 ts-node-esm index.ts,-esm是让 ts-node 以 ESModule语法执行。

但是!!!它又不识别 ts 后缀文件了。。。

在这里插入图片描述
在这里插入图片描述
然后排错了好久,查了好多解决方案:

  • package.json 和 tsconfig.json 配置冲突的
  • 安装 typescript

和我遇到的情形不一样,没什么卵用。。

4. 解决方案

然后还是去翻文档,找到这个:

在这里插入图片描述
意思就是,如果想要支持 ESMoudle,必须在 package.json 和 tsconfig.json 中如此配置。

我们执行 tsc -init, 生成 tsconfig.ts 文件。(tsc 命令文末有补充)

在这里插入图片描述
设置 "moduleResolution": "node", ,指定 TypeScript 如何从给定的模块指定符中查找文件。

运行报错 npm run dev,报错:

在这里插入图片描述
ERR_UNSUPPORTED_DIR_IMPORT:这个错误表明你尝试导入的目录不是一个合法的、可导入的模块结构。

这需要我们把导入路径补全:

import Login from "./src/login/index.ts";

在这里插入图片描述
设置 "allowImportingTsExtensions": true"noEmit": true 支持 ts扩展名,解决报错。

最终 tsconfig.ts 配置如下:
tsconfig.ts

{"compilerOptions": {/* Language and Environment */"target": "es2016",                       /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. *//* Modules */"module": "ESNext",                       /* Specify what module code is generated. */"moduleResolution": "node",               /* Specify how TypeScript looks up a file from a given module specifier. */"allowImportingTsExtensions": true,       /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */"noEmit": true,                           /* Disable emitting files from a compilation. */"esModuleInterop": true,                  /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */"forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. *//* Type Checking */"strict": true,                           /* Enable all strict type-checking options. */"skipLibCheck": true                      /* Skip type checking all .d.ts files. */},"ts-node": { "esm": true }
}

修改对应配置后,发现运行还是不行,又回到最初的报错了。。。

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts"

在这里插入图片描述

WTM,这是逼我搞玄学呀!

我们看第一段话,意思大概是,(node 的底层都是 CommonJS,)node 的 ESMoudle 功能支持目前是试验阶段,随时可能会变化。我们会尽量稳定对 ESMoudle 的支持,但是它依赖某些API,并且这些API可能会在新版本的 node 中中断,所以不建议生产中使用。

OK,那就很明了了,肯定是 node版本问题,新版本的 node 可能还没有适配。

经过我的测试,结果如下:

  • 在没有 tsconfig.json 的情况下,16版本及以上都会出现问题,14,15版本都是OK的,再低的版本我就没测了。
  • 而在有 tsconfig.json 的情况下,最高可以支持到 18.18.0 版本。

于是,我把我的 node 版本从 20 降到 18,就能成功运行了。

5. 补充

这是一个常规的 ts文件运行方法,先编译后运行。

npm i typescript	// tsc// 编译 ts 为 js
tsc index.ts
npm i nodemon	// nodemon// 热加载 index.js
nodemon index.js

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

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

相关文章

《鸿蒙生态:开发者的机遇与挑战》

一、引言 在当今科技飞速发展的时代,操作系统作为连接硬件与软件的核心枢纽,其重要性不言而喻。鸿蒙系统的出现,为开发者带来了新的机遇与挑战。本文将从开发者的角度出发,阐述对鸿蒙生态的认知和了解,分析鸿蒙生态的…

PHP代码审计 - SQL注入

SQL注入 正则搜索(update|select|insert|delete).*?where.*示例一: bluecms源码下载:source-trace/bluecms 以项目打开网站根目录,并以ctrlshiftf打开全局搜索 (update|select|insert|delete).*?where.*并开启正则匹配 最快寻找脆弱点的…

Essential Cell Biology--Fifth Edition--Chapter one (5)

1.1.4 The eukaryotic cell [真核细胞] 真核细胞,一般来说,比细菌和古细菌更大,更复杂。有些是独立的单细胞生物,如变形虫和酵母(图1-14);另一些则生活在多细胞集合中。所有更复杂的多细胞生物…

线程-2-线程概念与控制

main 线程常见寄存器(CR3 EIP IR MMU TLB) CR3是当前进程页表物理内存地址(包不能虚拟地址,不然套娃了) CPU中有寄存器指向task_struct* current EIP:入口虚拟地址 IR:当前命令地址系统总线&a…

Vulkan 开发(十一):Vulkan 交换链

Vulkan 系列文章: 1. 开篇,Vulkan 概述 2. Vulkan 实例 3. Vulkan 物理设备 4. Vulkan 设备队列 5. Vulkan 逻辑设备 6. Vulkan 内存管理 7. Vulkan 缓存 8. Vulkan 图像 9. Vulkan 图像视图 10. Vulkan 窗口表面(Surface&#xff…

【HarmonyOS】鸿蒙系统在租房项目中的项目实战(一)

从今天开始,博主将开设一门新的专栏用来讲解市面上比较热门的技术 “鸿蒙开发”,对于刚接触这项技术的小伙伴在学习鸿蒙开发之前,有必要先了解一下鸿蒙,从你的角度来讲,你认为什么是鸿蒙呢?它出现的意义又是…

百度搜索AI探索版多线程批量生成TXT原创文章软件-可生成3种类型文章

百度搜索AI探索版是百度推出的一款基于大语言模型文心一言的综合搜索产品‌。以下是关于百度搜索AI探索版的详细介绍: ‌产品发布‌:百度搜索AI探索版在百度世界大会上进行了灰度测试,并面向用户开放体验‌。 ‌核心功能‌:与传…

Linux软件包管理与Vim编辑器使用指南

目录 一、Linux软件包管理器yum 1.什么是软件包? 2.什么是软件包管理器? 3.查看软件包 4.安装软件 ​编辑 5.卸载软件 Linux开发工具: 二、Linux编辑器---vim 1.vim的基本概念 (1) 正常/普通模式(Normal mode&#xff0…

Android Osmdroid + 天地图 (一)

Osmdroid 天地图 前言正文一、配置build.gradle二、配置AndroidManifest.xml三、获取天地图的API Key① 获取开发版SHA1② 获取发布版SHA1 四、请求权限五、显示地图六、源码 前言 Osmdroid是一款完全开源的地图基本操作SDK,我们可以通过这个SDK去加一些地图API&am…

2024国内AI工具十大推荐丨亲测好用‼️

🚀探索了市面上数百款AI工具后,我精心挑选了10款在不同场景下超级好用的神器,快来一起看看吧!🌟 1️⃣豆包 基于云雀模型开发,具备聊天机器人、写作助手、英语学习助手等功能,能够进行多轮对话…

Unity学习---IL2CPP打包时可能遇到的问题

写这篇主要是怕自己之后打包的时候出问题不知道怎么搞,所以记录一下。 问题一:类型裁剪 IL2CPP打包后会自动对Unity工程的dll进行裁剪,将代码中没有引用到的类型裁剪掉。特别是通过反射等方式调用一些类的时候,很容易出问题。 …

多模态大模型(2)--BLIP

大模型如火如荼,研究者们已经不再满足于基本文本的大语言模型(LLM, Large Language Model),AI领域的热点正逐步向多模态转移,具备多模态能力的多模态大型语言模型(MM(Multi-Modal)-L…

基于MATLAB身份证号码识别

课题介绍 本课题为基于连通域分割和模板匹配的二代居民身份证号码识别系统,带有一个GUI人机交互界面。可以识别数十张身份证图片。 首先从身份证图像上获取0~9和X共十一个号码字符的样本图像作为后续识别的字符库样本,其次将待测身份证图像…

Siggraph Asia 2024 | Adobe发布MagicClay:可通过文字引导去对3D模型中的特定部分进行雕刻

今天给大家介绍一篇来自Adobe研究人员在Siggraph Asia 2024上发表的最新工作MagicClay,它是一款结合网格和距离场(SDF)的混合式工具,可以通过文字引导去对3D模型中的特定部分进行雕刻。允许艺术家通过文字提示进行局部网格编辑,支持生成具纹理…

滑动窗口的使用

一、定义与基本原理 滑动窗口是一种流量控制技术,也用于管理和处理数据流。它通过定义一个固定大小或可根据特定条件动态调整的窗口,在数据流或数据序列上滑动,以便高效地处理其中的数据。这种技术能够限制同时处理的数据量,从而…

Python学习26天

集合 # 定义集合 num {1, 2, 3, 4, 5} print(f"num:{num}\nnum数据类型为:{type(num)}") # 求集合中元素个数 print(f"num中元素个数为:{len(num)}") # 增加集合中的元素 num.add(6) print(num) # {1,2,3,4,5,6} # 删除…

android开发

文章目录 android开发 类微信界面整体框架展示:主页Fragment_MainActivity2:1. 聊天界面2. 用户界面用户界面的跳转 3. 朋友圈界面4. 我的界面 android开发 类微信界面 整体效果展示: 整体框架展示: 4个主要的fragment页面&#…

【大数据学习 | flume】flume的概述与组件的介绍

1. flume概述 Flume是cloudera(CDH版本的hadoop) 开发的一个分布式、可靠、高可用的海量日志收集系统。它将各个服务器中的数据收集起来并送到指定的地方去,比如说送到HDFS、Hbase,简单来说flume就是收集日志的。 Flume两个版本区别: ​ 1&…

vmware安装Ubuntu桌面版系统

1安装环境 vmware版本:VMware Workstation 17 Ubuntu版本:ubuntu-24.04.1-desktop-amd64.iso 文档时间:2024年11月 每一个Ubuntu的版本安装显示可能不一样,但安装方法是类似的 2镜像下载 Ubuntu官网:[https://ubun…

STL--map、set的使用和模拟实现

1.set 1.1 set的概念 set 是一种基于 平衡二叉搜索树(通常是红黑树) 实现的容器,它提供了有序集合的功能。set 用于存储唯一的元素,并且元素是按照某种顺序排列的(通常是升序)。 set 确实是一个关联式容…