在我的日常博客写作中，经常要在文章中插入图片，这样一来，网页的加载速度就被降低了，为了提高网页的加载速度，我决定压缩图片

Tinypng网站

最开始，我是在一个叫做Tinypng的网站上进行在线压缩的，然后再从网站上下载压缩后的图片。
但是，这家压缩后的文件是以压缩包的形式让你下载的。这就导致我使用的时候步骤极其繁琐，需要经历

上传，下载，解压，复制，粘贴覆盖

五个步骤，之后我就寻找有没有更简便的方法

super-tinypng

这是一个作者开发的通过官方api无限制上传并下载的插件叫做super-tinypng。
这个小插件使用非常简单，打开cmd进入到你想要压缩的文件夹目录下，输入super-tinypng即可压缩所有png，jpg图片。
但是，这个插件输出是在当前目录下新建一个叫做out的文件夹，并将压缩后的图片放入该文件夹。虽然比起之前已经很简单了，但我想应该再简单一点，于是我修改了他的源文件

super-tinypng加强版

首先，我定了两点目标

1.递归压缩文件夹下面的所有图片
2.输出文件直接覆盖图片

首先，来看作者的js文件
上面是一些参数，具体就是这几个函数

首先，调用fileList函数获取到当前文件夹下的所有文件的文件名称，并存在files数组中

fileList中具体使用的是fs.readdir方法

然后fileList再对files数组中的每个元素使用fileFilter方法过滤（返回的元素是jpg或者png图片）。

对fileFilter返回的元素使用fileUpload方法上传。

上传成功的话就调用fileUpdate方法输出压缩后的图片。

好了，这就是原作者的思路，要实现我的功能，首先需要能获取到当前目录下所有文件的文件名称

注意：是文件名称，不是文件夹名称哦

首先你要知道这个函数

fs.statSync()

tips:Sync表示该函数是同步的

这个函数返回的stats对象中有一个可以判断该文件是否为文件夹的函数
下面这段代码就是我的思路

function fileList_my(folder) {
    //获取到当前文件夹下所有文件的文件名称的数组
    let files = fs.readdirSync(folder);
    files.forEach(file => {
    //遍历数组，如果是文件夹就继续往下走
    //记得在路径中加上当前文件夹名称
    let stats=fs.statSync(path.join(folder, file));
    if(stats.isDirectory()){
      fileList_my(path.join(folder, file));
    }
  });
  //相当于在当前目录下直接调用super-tinypng
  fileList(folder);
}

至此，就完成了我的第一个目标，递归压缩文件夹下所有png，jpg图片。

接下来是我的第二个需求，这个倒是很简单

const outputDir = path.join(cwd , 'output');
//将输出文件夹创建到当前目录下
//imgpath = path.join(cwd , 'output', imgpath.replace(cwd, ''));
imgpath= path.join(cwd , imgpath.replace(cwd, ''));
// 不创建out文件夹
// if(!fs.existsSync(outputDir)) {
//   fs.mkdirSync(outputDir);
// }

其中注释掉的上原来的代码，将其输出的路径中的out去掉即可直接覆盖源文件，然后注释掉创建out文件夹的代码。

ok，完成第二个需求

从这个小东西的改装中，我学到了node中fs模块的一些函数的应用如果你想使用这个东西，请直接复制我的代码进去并使用我的方法
⬇️ 就是这样 ⬇️

fileList_my(root);