最新vite脚手架配置ts-node工具

在使用最新的vite脚手架进行vue组件开发时,编写的ts文件工具函数的测试,除了应用到组件中进行页面测试,也可以使用ts-node工具进行单独的测试。

在使用最新版本的vite脚手架,生成的tsconfig配置会分出多个配置:tsconfig.json、tsconfig.app.json、tsconfig.node.json,需要改为原始的两个配置:tsconfig.json、tsconfig.node.json,不然执行ts-node会报错。

具体操作如下:

全局安装:

shell 复制代码
npm i -g ts-node

执行ts-node命令 会在项目根路径下找tsconfig.json中包含的应用配置,而最新vite脚手架生成的ts的应用配置放在了tsconfig.app.json中。为了方便测试,改成原来的形式,即:tsconfig.json中包含应用配置。

tsconfig.json

json 复制代码
{
	... // app配置
	"ts-node": {
		"esm": true
	},
	"references": [{ "path": "./tsconfig.node.json" }]
}

还要注意!导入的ts文件的后缀不能省略,不然会报找不到导入的模块!

拿咱们tree组件的树结构拍平函数做一个测试:


相关推荐
孟陬3 小时前
不用盲调性能参数 Vitest 5.0 新推出 `vitest doctor` 一键诊断测试慢卡点,自动给出最优提速配置
性能优化·单元测试·vite
cindershade2 天前
大包不是一个数字:Vite 构建体积的责任归因与边界治理
vite
cindershade9 天前
首屏不是 dist:用“加载账本”治理 Vite 的大包
性能优化·vite
陪我一起学编程11 天前
vue3笔记
前端·webpack·vue3·vite·脚手架·vue3笔记·组件式
向北丶1 个月前
vite项目中配置alias别名
前端·vite
PedroQue991 个月前
修复 .uvue 页面路径残留问题
前端·vite
梦曦i1 个月前
修复 .uvue 页面路径残留问题
前端·vite
ynchyong1 个月前
TS 基础
typescript·ts
ynchyong1 个月前
VUE 中 不能将类型“R[]”分配给类型“UnwrapRefSimple<R>[]”
typescript·vue·ts·unwraprefsimple
cindershade1 个月前
首屏在替谁付费:重做 Vite 产物治理的责任边界
vite