前几天遇到一个批量处理文件的需求，需要用node来实现，由于第一次接触它，没啥经验，又想写TS，于是就搭建了这么一套环境，期间也踩了挺多坑。

本文就跟大家分享下我的实现过程，欢迎各位感兴趣的开发者阅读本文。

首先我们创建一个空项目，在项目根目录创建package.json文件。在文件中填写项目的基础信息，如下所示：

上述代码中，各个字段的含义：

按照自己的实际情况填写即可。

注意：你也可以使用yarn或者npm来初始化一个项目，在初始化过程中会提示你填写上述信息，命令为: yarn init | npm init。

开源社区中有一个名为ts-node的库，它可以运行时解析ts，执行node的API，读完它的文档后，我们知道了在项目中安装它的方法，如下所示：

上述命令中，我们安装了typescript,ts-node,tslib,@types/node这四个包，上述代码中的|是或者的意思，提供了npm的安装方法和yarn的安装方法，根据自己的实际需求执行对应的命令即可。

在项目根目录创建tsconfig.json文件，具体的配置请移步tsconfig配置，我的配置文件如下所示：

接下来，我们引入几个node的api来测试下上面的配置，看看能否正常运行。

如下所示，我在项目根目录创建了handle-themes-file文件夹，并在文件夹内部创建了lib文件夹和main.ts文件。

我们在lib文件夹下创建HandleThemes.ts文件，在这里编写一个获取文件夹下所有文件的方法，代码如下所示：

最后，我们在main.ts下导入HandleThemes.ts，实例化后，调用getFolderFiles方法，如下所示：

在ts-node的文档中，我们知道了在终端/命令行进入我们的项目根目录，执行ts-node xxx.ts就能执行了，此处我们运行的文件是main.ts文件，那么要执行的命令就为：

然而，事情并没我们现象的那么顺利，命令执行后，会看到如下所示的报错：

看报错提示，让在package.json中添加一个type类型为module的字段，那么我们就声明下，如下所示：

当我再次运行时，它又换了新的报错。

百度这个报错时，基本上就一篇文章抄来抄去的

这篇文章说是因为找不到导入的模块，需要在导入时添加文件的后缀名，且需要把ts后缀换成js，我跟着操作后，报错依然存在。

我又看了一圈官方文档，说是让用node --loader ts-node/esm来执行

于是，我就换了这个命令，结果又换了新错误。

折腾到这里，我已经用尽自己所能去找解决方案了，仍然没解决，只好去寻求网友的帮助，最后在@皮的很的帮助下，解决了这个问题。

在他的帮助下，我才知道，原来要改tsconfig.json的配置才行😂。

要改的地方有2处，如下所示：

做完上述配置后，我们把刚才在package.json修改的项目类型删掉，以及在导入时添加的js后缀也一起删掉。

最后在终端执行ts-node handle-themes-file/main.ts，成功执行。

每次都要进入终端，敲一边命令才能执行ts文件，这太麻烦了，我希望的是可以在编辑器中点一下就能运行当前可视区域的ts文件。

在WebStorm中是支持这个操作的，只需简单的配置即可，步骤如下：

在弹出的面板中，添加一条执行命令。

填写命令名称、执行脚本、环境变量，最后点OK即可完成配置。

配置完成后，我们就可以通过点击工具栏的 运行图标 来运行了。

如果你没玩过webstorm，可以移步我的另一篇文章：合理使用WebStorm-环境配置篇，亲自上手体验一波。

本文创建的项目，GitHub地址为：ts-node-utils

项目中还加入了其他的一些规范代码的东西，如果你对此感兴趣，请移步：

至此，文章就分享完毕了。

我是神奇的程序员，一位前端开发工程师。

如果你对我感兴趣，请移步我的个人网站，进一步了解。