qleaner 1.0.16 → 1.0.17

package/bin/cli.js

@@ -2,6 +2,7 @@
 const { Command } = require("commander");
 const { list, scan } = require("../controllers/list");
 const { clearCache } = require("../utils/cache");
+const { getUnusedImages } = require("../controllers/image");
 
 async function loadChalk() {
   return (await import("chalk")).default;
@@ -58,16 +59,25 @@ async function loadChalk() {
   program
   .command('qlean-image')
   .description("Scan the project for unused images")
-  .argument("<path>", "The path to the directory to scan for unused images")
-  .option("-e, --exclude-dir <dir...>", "Exclude directories from the scan")
-  .option("-f, --exclude-file <file...>", "Exclude files from the scan")
+  .argument("<directory>", "The path to the directory to scan for unused images")
+  .argument("<rootPath>", "The root path to the project code utilizing the images")
+  .option("-e, --exclude-dir-assets <dir...>", "Exclude directories from the scan")
+  .option("-f, --exclude-file-asset <file...>", "Exclude files from the scan")
   .option(
-    "-F, --exclude-file-print <files...>",
+    "-F, --exclude-file-print-asset <files...>",
+    "Scan but don't print the excluded files"
+  )
+  .option("-E, --exclude-dir-code <dir...>", "Exclude directories from the scan")
+  .option("-S, --exclude-file-code <file...>", "Exclude files from the scan")
+  .option(
+    "-P, --exclude-file-print-code <files...>",
     "Scan but don't print the excluded files"
   )
   .option("-t, --table", "Print the results in a table")
-  .action(async (path, options) => {
-
+  .option("-d, --dry-run", "Show what would be deleted without actually deleting (skips prompt)")
+  .option("-C, --clear-cache", "Clear the cache")
+  .action(async (directory, rootPath, options) => {
+    await getUnusedImages(ora, chalk, directory, rootPath, options);
   });
   program.parse(process.argv);
 })();

package/command.js

@@ -11,6 +11,7 @@ const {
   needsRebuild,
   saveCache,
 } = require("./utils/cache");
+const { isExcludedFile, compareFiles } = require("./utils/utils");
 
 async function getFiles(directory = "src", options, chalk) {
   const contentPaths = [`${directory}/**/*.{tsx,ts,js,jsx}`];
@@ -176,7 +177,6 @@ async function unUsedFiles(chalk, directory = "src", options) {
       let isFound = false;
       while (!isFound && i < imports.length) {
         const importFilePath = await resolver(
-          chalk,
           imports[i].file,
           imports[i].from
         );
@@ -208,13 +208,7 @@ async function unUsedFiles(chalk, directory = "src", options) {
   return unusedFiles;
 }
 
-function isExcludedFile(file, excludeFiles) {
-  return excludeFiles.some((exclude) => file.includes(exclude));
-}
 
-function compareFiles(filePath, importPath) {
-  return filePath === importPath;
-}
 
 module.exports = {
   getFiles,

package/controllers/image.js

@@ -0,0 +1,191 @@
+const fg = require("fast-glob");
+const fs = require("fs");
+const parser = require("@babel/parser");
+const traverse = require("@babel/traverse").default;
+const { getCssImages } = require("../utils/cssImages");
+const path = require("path");
+const { createResolver } = require("../utils/resolver");
+const { compareFiles, isExcludedFile, askDeleteFiles } = require("../utils/utils");
+const Table = require('cli-table3');
+
+async function getUnusedImages(chalk, imageDirectory, codeDirectory, options) {
+  const usedImages = [];
+  const unusedImages = [];
+  const imageRegex = /\.(png|jpg|jpeg|svg|gif|webp)$/i;
+  const contentPaths = [`${imageDirectory}/**/*.{png,jpg,jpeg,svg,gif,webp}`];
+  if (options.excludeDirAssets && options.excludeDirAssets.length > 0) {
+    options.excludeDirAssets.forEach((dir) => {
+      contentPaths.push(`!${dir}/**`);
+    });
+  }
+  if (options.excludeFileAsset && options.excludeFileAsset.length > 0) {
+    options.excludeFileAsset.forEach((file) => {
+      contentPaths.push(`!${imageDirectory}/**/${file}`);
+    });
+  }
+
+  const rootPaths = [`${codeDirectory}/**/*.{js,jsx,ts,tsx}`];
+  if (options.excludeDirCode && options.excludeDirCode.length > 0) {
+    options.excludeDirCode.forEach((dir) => {
+      rootPaths.push(`!${dir}/**`);
+    });
+  }
+  if (options.excludeFileCode && options.excludeFileCode.length > 0) {
+    options.excludeFileCode.forEach((file) => {
+      rootPaths.push(`!${codeDirectory}/**/${file}`);
+    });
+  }
+
+  const files = await fg(contentPaths);
+  const codeFiles = await fg(rootPaths);
+
+  for (const file of codeFiles) {
+
+    const code = fs.readFileSync(file, "utf8");
+    const ast = parser.parse(code, {
+      sourceType: "module",
+      plugins: ["jsx", "typescript"],
+    });
+
+    traverse(ast, {
+      // <img src="...">
+      JSXAttribute(path) {
+        if (path.node.name.name !== "src") return;
+
+        const value = path.node.value;
+
+        // String literals: `img/a.png`
+        if (value.type === "StringLiteral") {
+          if (imageRegex.test(value.value)) {
+            usedImages.push({
+              value: value.value,
+              file,
+            });
+          }
+        }
+
+        if (value.type === "JSXExpressionContainer") {
+          const expr = value.expression;
+          // String literals: `img/a.png`
+          if (expr.type === "StringLiteral" && imageRegex.test(expr.value)) {
+            usedImages.push({
+              value: expr.value,
+              file,
+            });
+          }
+
+          // Template literals: `/images/${name}.png`
+          if (expr.type === "TemplateLiteral") {
+            expr.quasis.forEach((q) => {
+              if (imageRegex.test(q.value.raw)) {
+                usedImages.push({
+                  value: q.value.raw,
+                  file,
+                });
+              }
+            });
+          }
+        }
+      },
+
+      // String literals anywhere in code
+      StringLiteral(path) {
+        if (imageRegex.test(path.node.value)) {
+          usedImages.push({
+            value: path.node.value,
+            file,
+          });
+        }
+      },
+
+      // Template literals: `/images/${name}.png`
+      TemplateLiteral(path) {
+        path.node.quasis.forEach((quasi) => {
+          if (imageRegex.test(quasi.value.raw)) {
+            usedImages.push({
+              value: quasi.value.raw,
+              file,
+            });
+          }
+        });
+      },
+
+      // Arrays: ["img/a.png", "img/b.png"]
+      ArrayExpression(path) {
+        path.node.elements.forEach((el) => {
+          if (el?.type === "StringLiteral" && imageRegex.test(el.value)) {
+            usedImages.push({
+              value: el.value,
+              file,
+            });
+          }
+        });
+      },
+
+      // Objects: { image: "img/a.png" }
+      ObjectProperty(path) {
+        const val = path.node.value;
+        if (val.type === "StringLiteral" && imageRegex.test(val.value)) {
+          usedImages.push({
+            value: val.value,
+            file,
+          });
+        }
+      },
+    });
+  }
+
+  const cssImages = await getCssImages(codeDirectory);
+  const combinedImages = [...usedImages, ...cssImages];
+
+
+  const resolver = createResolver(imageDirectory);
+
+  for (const file of files) {
+    let i = 0
+    let isFound = false;
+    while(!isFound && i < combinedImages.length) {
+        const imageFilePath = await resolver(path.resolve(combinedImages[i].file), combinedImages[i].value);
+        if(compareFiles(path.resolve(file), imageFilePath)) {
+            isFound = true;
+            break;
+        }else if(i === combinedImages.length - 1) {
+            if(options.excludeFilePrint && options.excludeFilePrint.length > 0) {
+                if(!isExcludedFile(file, options.excludeFilePrint)) {
+                    unusedImages.push(file);
+                }
+            }else{
+                unusedImages.push(file);
+            }
+        }
+        i++;
+    }
+  }
+
+  if(options.table) {
+    const table = new Table({
+      head: options.dryRun ? ['Unused Images (Would Delete)'] : ['Unused Images'],
+      colWidths: [50]
+    });
+    unusedImages.forEach(image => {
+      table.push([image]);
+    });
+    console.log(table.toString());
+  }else{
+    unusedImages.forEach(image => {
+      console.log(chalk.red(image));
+    });
+  }
+
+  if(options.dryRun && unusedImages.length > 0) {
+    console.log(chalk.cyan(`\n[DRY RUN] Would delete ${unusedImages.length} file(s)`));
+    console.log(chalk.cyan('Run without --dry-run to actually delete files\n'));
+  } else if (!options.dryRun && unusedImages.length > 0) {
+    askDeleteFiles(unusedImages);
+  }
+  return unusedImages;
+}
+
+module.exports = {
+  getUnusedImages,
+};

package/controllers/list.js

@@ -45,15 +45,6 @@ async function scan(chalk, path, options) {
     }
 }
 
-async function image(chalk, path, options) {
-    const unusedImages = await unUsedImages(chalk,path, options);
-    if(options.table){
-      console.log(chalk.yellow('***************** Unused Images *****************'));
-      console.log(unusedImages.toString());
-    }
-}
-
-
 module.exports = {
   list,
   scan

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "qleaner",
   "packageManager": "yarn@4.6.0",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "main": "command.js",
   "bin": "./bin/cli.js",
   "scripts": {
@@ -20,6 +20,7 @@
     "commander": "^14.0.2",
     "enhanced-resolve": "^5.18.3",
     "fast-glob": "^3.3.3",
+    "ora": "^9.0.0",
     "prompts": "^2.4.2"
   }
 }

package/{cssImages.js → utils/cssImages.js}

@@ -1,9 +1,9 @@
 const fs = require('fs');
 const fg = require('fast-glob');
+const path = require('path');
 
-function extractCssImages(cssContent) {
+function extractCssImages(cssContent, images, file) {
   const urlRegex = /url\((['"]?)(.*?)\1\)/g;
-  const images = new Set();
   let match;
 
   while ((match = urlRegex.exec(cssContent)) !== null) {
@@ -11,23 +11,28 @@ function extractCssImages(cssContent) {
 
     // Only collect image file types
     if (/\.(png|jpg|jpeg|svg|gif|webp)$/i.test(url)) {
-      images.add(url);
+      images.push({
+        value: url,
+        file: path.resolve(file),
+      });
     }
   }
-
-  return Array.from(images);
+  return images
 }
 
-async function getCssImages() {
+async function getCssImages(directory = "src") {
   const cssFiles = await fg([
-    "src/**/*.{css,scss}",
+    `${directory}/**/*.{css,scss}`,
   ]);
+  let images = [];
   for (const file of cssFiles) {
     const css = fs.readFileSync(file, "utf-8");
-    const images = extractCssImages(css);
-    console.log(images);
+    images = extractCssImages(css, images, file);
   }
+  return images;
 }
 
-getCssImages();
+module.exports = {
+  getCssImages,
+};
 

package/utils/resolver.js

@@ -16,7 +16,7 @@ const resolver = create({
     ]
   });
 
-  return function resolveImport(chalk,sourceFile, importPath) {
+  return function resolveImport(sourceFile, importPath) {
     // console.log(chalk.yellow('sourceFile--resolver'), sourceFile, chalk.yellow('importPath--resolver'), importPath);
     return new Promise((resolve, reject) => {
       resolver(path.dirname(sourceFile), importPath, (err, result) => {

package/utils/utils.js

@@ -53,4 +53,16 @@ async function deleteFiles(files) {
     console.log(`Deleted ${files.length} files`);
 }
 
-module.exports = askDeleteFiles;
+function isExcludedFile(file, excludeFiles) {
+    return excludeFiles.some((exclude) => file.includes(exclude));
+  }
+  
+  function compareFiles(filePath, importPath) {
+    return filePath === importPath;
+  }
+
+module.exports = {
+    askDeleteFiles,
+    isExcludedFile,
+    compareFiles,
+};