图片压缩工具 | Electron应用配合 commander 提供命令行调用功能

OPEN-IMAGE-TINY,一个基于 Electron + VUE3 的图片压缩工具,项目开源地址:https://github.com/0604hx/open-image-tiny

功能描述

应用程序的命令行调用功能允许用户通过终端(如Windows的CMD/PowerShell或Linux/macOS的Terminal)直接输入命令与程序交互,无需图形界面。

关于 commander

Commander 是 Node.js 最流行的命令行工具库,用于快速构建 CLI 应用程序。它提供了声明式语法、参数解析、帮助生成等特性,简化命令行开发。

示例代码:

js 复制代码
const { program } = require('commander');

program
  .name('my-cli')
  .description('一个示例CLI工具')
  .version('1.0.0');

program
  .command('greet <name>')
  .option('-c, --capitalize', '大写输出')
  .action((name, options) => {
    let output = options.capitalize ? name.toUpperCase() : name;
    console.log(`Hello, ${output}!`);
  });

program.parse(); // 解析命令行输入

代码实现

我们在 electron 应用启动时,判断命令行参数的个数,如果超过正常启动的范围,则视为命令行方式调用。

js 复制代码
// electron/main.js
const handleCli = require('./cli')

if(process.argv.length > (app.isPackaged?1:2)){
    (async ()=>{
        //处理命令行
        await handleCli()
        setTimeout(app.quit, 200)
    })();
}
else{
    //创建 GUI 窗口
}
js 复制代码
// electron/cli.js
const pkg = require('../package.json')

const { Command } = require("commander")
const pc = require('picocolors')
const { splitImageVertical, convertFormat } = require('./tool')

const toInt = v=>parseInt(v)

module.exports = async()=>{
    const cli = new Command()
    cli.command("convert <file>")
        .alias("c")
        .description(`转换图片格式(支持 ${pc.green("JPG/PNG/WEBP/AVIF")})`)
        .option("-q, --quality [number]", "下载文件", toInt, 100 )
        .option("-t, --target [string]", "目标格式", "WebP")
        .option("--resize [string]", "裁剪方式,width=按宽度、height=按高度")
        .option("--resizeValue [number]", "裁剪大小/单位px", toInt)
        .option("-r, --rotate [number]", "旋转角度", toInt)
        .action(async (/**@type {String} */file, /**@type {import('./tool').ConvertConfig} */ps)=>{
            await convertFormat(file, null, ps)
        })

    cli.command("split <file>")
        .alias("s")
        .description("垂直切割图片")
        .option("-h, --height [number]", "切割高度/单位px", toInt, 1000)
        .option("-f, --fit [boolean]", "高度不足时自动填充", true)
        .option("-c, --color [string]", "填充高度", "#ffffff")
        .action(async (/**@type {String} */file, /**@type {import('./tool').SplitConfig} */ps)=>{
            await splitImageVertical(file, ps)
        })

    cli
        .name(pkg.name)
        .description(pkg.description)
        .version(pkg.version)
        .parseAsync()
        .catch(e=>console.error(`${pc.red("命令行执行出错:")}${e}`))
}
相关推荐
酷酷的逗逗乐3 小时前
前端转 Agent 开发 · 第六节
前端·程序员
回家吃饭去吧3 小时前
WebAssembly 深度解析:前端性能的最后一块拼图
前端
爱勇宝3 小时前
没有 Fn 键关触控板?我做了一个双击即用的 Windows 小工具
前端·后端·程序员
尤小小3 小时前
Vite-SSG 实践:Vue项目预渲染落地完整方案
前端·vue.js
默_笙3 小时前
🍕 AI 的嘴巴装了水管(上):从"等它说完"到"边说边听"的流式输出指南
前端·javascript
lichenyang4533 小时前
让 VK 小程序调用 HarmonyOS 原生能力:壳子 SDK 的实现思路
前端
梨想橙汁3 小时前
Vue3 组合式 API 深度解析:ref/reactive 响应式,计算属性与侦听器
前端·vue.js
暖焰核心3 小时前
继承全解——继承、默认成员函数、切片、隐藏与虚继承
java·前端·javascript
by组态3 小时前
Ricon组态系统API参考手册
前端·后端·物联网
前端逗比逗3 小时前
AI 前端落地实战:SSE 流式输出、断点续传、打字机渲染
前端·webassembly