破案了,为啥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这样的第三方库。

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

相关推荐
zqx_726 分钟前
随记 前端框架React的初步认识
前端·react.js·前端框架
惜.己43 分钟前
javaScript基础(8个案例+代码+效果图)
开发语言·前端·javascript·vscode·css3·html5
什么鬼昵称1 小时前
Pikachu-csrf-CSRF(get)
前端·csrf
长天一色1 小时前
【ECMAScript 从入门到进阶教程】第三部分:高级主题(高级函数与范式,元编程,正则表达式,性能优化)
服务器·开发语言·前端·javascript·性能优化·ecmascript
NiNg_1_2342 小时前
npm、yarn、pnpm之间的区别
前端·npm·node.js
秋殇与星河2 小时前
CSS总结
前端·css
BigYe程普2 小时前
我开发了一个出海全栈SaaS工具,还写了一套全栈开发教程
开发语言·前端·chrome·chatgpt·reactjs·个人开发
余生H2 小时前
前端的全栈混合之路Meteor篇:关于前后端分离及与各框架的对比
前端·javascript·node.js·全栈
程序员-珍2 小时前
使用openapi生成前端请求文件报错 ‘Token “Integer“ does not exist.‘
java·前端·spring boot·后端·restful·个人开发
axihaihai2 小时前
网站开发的发展(后端路由/前后端分离/前端路由)
前端