检测静态文件中的图片是否被使用。删除不被使用的图片资源

项目背景：vue3 众所周知，在webpack或者vite打包生成dist的情况下，静态资源中的没有被使用的文件是不会被打包在dist文件夹中的，但是是接手的项目么，就想着写一个脚本或者插件，把没有使用到的图片资源删除一下。这样静态资源起码看起来舒服一些。 于是乎，使用一个ai编程工具，几分钟写了一个脚本。 记录一下。

import fs from 'fs';
import path from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

const imageDir = path.join(__dirname, 'src/assets'); // 确保路径正确

function findUnusedImages(dir) {
  const files = fs.readdirSync(dir);

  files.forEach(file => {
    const filePath = path.join(dir, file);
    const stat = fs.statSync(filePath);

    if (stat.isDirectory()) {
      // 如果是目录，递归调用
      findUnusedImages(filePath);
    } else {
      const fileName = path.basename(file);
      const isUsed = searchFileInDirectory('src', fileName);
      if (!isUsed && fileName !== 'iconfont.js' && fileName !== 'iconfont.json') {
        console.log(`未引用的图片: ${fileName}`);
        fs.unlinkSync(filePath); // 删除文件
      }
    }
  });
}

function searchFileInDirectory(directory, searchTerm) {
  const files = fs.readdirSync(directory);

  for (const file of files) {
    const filePath = path.join(directory, file);
    const stat = fs.statSync(filePath);

    if (stat.isDirectory()) {
      if (searchFileInDirectory(filePath, searchTerm)) {
        return true;
      }
    } else {
      const content = fs.readFileSync(filePath, 'utf-8');
      if (content.includes(searchTerm)) {
        return true;
      }
    }
  }
  return false;
}

findUnusedImages(imageDir);

很方便，很舒服。