我们写typescript的时候一直想希望用到工具将js转换为d.ts文件,这样可以直接让ts调用其中的js代码。我们日常中用到相当多的js类库,有些类库无法直接使用ts,这样就比较麻烦。
我们先找到dtsmake 的npm 包的链接:https://www.npmjs.com/package/dtsmake 官方wiki实在是太长,我们只看其中两个指令:
代码语言:javascript复制dtsmake -s ./path/to/sourcefile.js
代码语言:javascript复制dtsmake -s ./path/to/src/target.js --dist ./path/to/dist/mydefinition -n "mydefinition" -p node -e -S "legacy" -M "MyDefinition" -x "./path/to/extrafile1.js,./path/to/extrafile2.js" -N --def ./path/to/def/ecma6 -A -i -a -g
这两个指令可以帮助我们获取到d.ts文件。
重点来了,我们所知,一般一个库里面有将近20~30个js文件,如何一一将他们转变成d.ts文件呢,我们打开cmd 一行一行输入肯定太慢,这里我推荐使用我下面的方法——书写批处理文件来使用:
1、书写bat文件:
其步骤为: a.新建一个txt文档 b.重命名文档为:xxx.bat( 这里为了方便我重命名为 dtsmake.bat,这个对结果没影响,如果文件名无法处理,那么在控制面板中“文件夹选项”里面自行调整显示文件后缀。) c.书写指令:
bat.png
2、打开js类库的src目录
博主以百度文字识别的nodejs library来处理:
a.打开aip-node-sdk-2.3.10目录
b.使用npm或yarn 命令添加tern
yarn add tern
c.打开src目录
d.放入刚刚写好的bat文件在src根目录下
3、执行bat
以上前提工作完成,双击打开我们的bat文件
确定前提.png
这里一定要返回src目录下查看是否自动生成了src.txt文件:
已经自动生成src.txt.png
然后按下任意按钮
自动dtsmake.gif
4、查看
查看目录:
转换好的目录.png
查看转换文件:
空文件.png
发现每个文件都是空文件,.d.ts文件为啥为空呢?原来发现dtsmake官方文档不全,其中有存在bug等问题,于是博主继续重写.bat来完成后续工作。
5、解决问题
a.重写dmake.bat:
重写dmake.bat.png
b.书写index.bat 与delete.bat并且将此放到与dmake.bat同等目录下:
index.png
delete.png
c.将此三个bat放到src根目录下:
重放的目录.png
d.运行index.bat
复制完dmake的bat文件.png
e.启动当前目录与子目录下的dmake运行
运行.gif
d.退出index.bat
退出index.png
e.再一次查看生成目录与检查文件
目录.png
这个时候的文件.png
说明此时我们的批处理成功了!
6、清理目录
最后运行delete.bat 整个目录全部清理:
清理目录.gif
这样我们完成了目录所有的src的.d.ts转换!