破案了,为啥TypeScript5.3编译let、const一直是var

啊!2024才学TypeScript还有价值吗?!学的话,就用最新的上。

1.环境

  • pnpm -v 8.15.4
  • tsc -v Version 5.3.3
  • node -v v20.10.0

2.背景&测试

使用pnpm安装了最新的TypeScript5.3.3,开始学习ts类型。 发现不论是let、const使用tsc编译完都是var。强迫症表示ES2016起不能接受var,尝试各种配置tsconfig.json后无效。

为什么let 经过tsc编译后 let=>var

简化此图投图问路群友。

我的测试:使用单条语句竟可以得到我期待的结果 let =>let

shell 复制代码
tsc --target es6 --module commonjs 2.ts

甲: 这个有可能是let 现在所声明属于全局作用域自动转成了var 也就是说用var 语义化更清晰!

我: 啊??ES6的增加的let、const不是更加严谨,TS也不会故意降级处理吧,我想要TS给我let=>let,const=>const的结果

乙: 这个看起来是没用当前目录的 tsconfig,如果你的 TypeScript 装在当前目录的话应该是用 npx tsc 而不是 tsc,你能命令行直接使用 tsc 说明是全局装了 TypeScript,可能因此用的是全局的 tsconfig。

我: 大佬啊,说得八九不离十了,很可能是tsconfig配置没生效的问题,或tsc调用的版本不对,马上测试。但是没有npx!这样调用不合理。我决定还是先搞懂tsc命令吧

群友 丙: 要用es2017。( 指"target": "es2017" )

群友 丁: 你配置下成最新的浏览器兼容版本。( 指"target": "ESNext" )

我: 两位群友都在说tsconfig配置不对,ES6===ES2015配置的"target": "es2016" 理应支持let、const,可能是tsconfig格式不对?参数不对?

感谢群友的交流。我进行两个方向的尝试:

1.故意加入干扰字符,确定当前tsconfig配置瞎写也不报错,进一步证明程序并未读取tsconfig.json。

2.查找tsc是否可能存在两个不同版本的TypeScript,有一个在全局运行,怀疑调用tsc是其中一个版本。

决定重装TypeScript,使用pnpm 卸载 typescript。

shell 复制代码
pnpm rm -g typescript
pnpm rm  typescript

好家伙,卸载了5.3.3 ,咋还有一个typescript 4.9.5 ???

回想起来去年使用npm装过typescript,

而pnpm直接卸载自己安装的,干不掉npm安装的。

shell 复制代码
npm rm -g typescript
npm rm  typescript

测试4.9.5或卸载重装typescript5.3,结果然而运行结果仍 let => var。

找了一圈没有发现全局配置 tsconfig.json文件的存在,判断不是tsc版本差异。

综上得出结论,tsc 文件.ts编译时无视tsconfig.json。

在指定 tsc --target es6 --module commonjs 文件.ts时读取配置参数有效。

那就看看tsc命令吧,想起来很多命令都可以-help打印课执行项,于是tsc -h :

3.好家伙!破案了!

命令 tsc 文件名.ts

无视 tsconfig.json 文件,使用默认编译选项 编译 指定文件。
命令 tsc

编译当前项目(使用当前工作目录的 tsconfig.json 进行配置 )。

使用当前工作目录的 tsconfig.json 进行配置,我们应该用tsc命令,不要带任何参数

4.发现误区

问题1:Node.js能直接运行 .ts文件了,不信你看。
回答:我差点以为发现了新大陆,我也很希望node 文件.ts可以直接诶运行,毕竟我的Node.js和TS都很新。

很遗憾!这个ts文件 === js文件,不存在TS需要编译的部分!!!

这里node 运行的ts代码和编译后的js一模一样!!!只不过名字从 info.js=>info.ts,这还是JS!!

换个简单的例子,接受现实吧。还得使用ts-node这样的第三方库。

人生三大错觉:电话响了、我能反杀、她还爱我。

相关推荐
light blue bird5 分钟前
工序路径主子表单工序组装图表组件
前端·数据库·信息可视化·.net·web端·razor page
linlinlove216 分钟前
前端uniapp、后端thinkphp股票系统开发功能展示、代码披露、HQChart
前端·uni-app·echarts·thinkphp·hqchart·配资·deepseek选股票
万少19 分钟前
Claude Code 任务结束会自己喊你:一个 Stop Hook 搞定提示音
前端·后端·代码规范
ZC跨境爬虫28 分钟前
跟着 MDN 学CSS day_30:(玩转列表样式,从基础到进阶)
前端·css·html·tensorflow·媒体
追光者♂30 分钟前
【测评系列3】CSDN AI数字营销实测体验官:测试 开源项目——Superpowers 游戏引擎从零开发实战指南
人工智能·深度学习·机器学习·typescript·开源·游戏引擎·superpowers
ct97833 分钟前
TypeScript 中的泛型
前端·javascript·typescript
IT_陈寒36 分钟前
React hooks闭包陷阱把我坑惨了,原来这才是正确用法
前端·人工智能·后端
nnsix44 分钟前
MVC、MVP、MVVM 架构 笔记
java·开发语言·前端
qq_4203620344 分钟前
前端国际化方案
前端·javascript·vue.js·国际化·reactjs
向上的车轮1 小时前
React 19 快速入门:拥抱服务端组件与新特性的现代化开发
前端·javascript·react.js