Eva Icons 图标批量操作:Node.js脚本实现批量重命名
【免费下载链接】eva-icons A pack of more than 480 beautifully crafted Open Source icons. SVG, Sketch, Web Font and Animations support. 项目地址: https://gitcode.***/gh_mirrors/ev/eva-icons
你是否还在手动逐个重命名成百上千个SVG图标文件?面对Eva Icons中480+图标文件的重命名需求,重复的手工操作不仅耗时还容易出错。本文将带你通过项目内置的Node.js脚本实现图标批量重命名,5分钟完成原本2小时的工作量。读完本文你将掌握:脚本配置方法、自定义命名规则、批量处理两种图标风格的技巧。
项目脚本架构
Eva Icons的图标处理逻辑集中在scripts/目录,其中重命名功能核心实现位于scripts/services/rename-icon.js。该脚本通过Node.js的文件系统模块(fs)实现批量文件重命名,配合scripts/config.js中的路径配置,可高效处理package/icons/目录下的所有图标文件。
核心文件关系
脚本工作原理
rename-icon.js的核心函数renameIcons实现了三个关键步骤:
- 读取源目录下所有图标文件
- 过滤已包含目标后缀的文件(避免重复处理)
- 应用命名规则生成新文件名并执行重命名
关键代码片段:
const getNewFileName = (srcFile, extension, postfix) =>
`${path.basename(srcFile, `.${extension}`)}-${postfix}.${extension}`;
// 重命名逻辑
fs.renameSync(
path.resolve(srcPath, srcFile),
path.resolve(srcPath, newFileName)
);
配置文件config.js定义了默认参数:
{
"srcPath": "../package/icons", // 图标源目录
"defaultExtension": "svg" // 默认文件扩展名
}
批量重命名操作步骤
1. 环境准备
确保已安装Node.js环境,克隆项目仓库:
git clone https://gitcode.***/gh_mirrors/ev/eva-icons
cd eva-icons
2. 配置重命名规则
修改scripts/config.js中的参数,设置目标后缀:
// 在config对象中添加
"renameOptions": {
"postfix": "filled" // 例如添加"filled"后缀
}
3. 执行重命名脚本
node scripts/index.js --rename
脚本将自动处理package/icons/fill/svg/目录下的所有SVG文件,例如将arrow-ios-downward.svg重命名为arrow-ios-downward-filled.svg。
高级应用:双风格图标同步处理
针对Eva Icons同时存在的fill和outline两种风格,可通过修改脚本实现差异化命名:
- 复制rename-icon.js为
rename-outline.js - 修改后缀参数为"outline"
- 配置不同的源目录路径:
// 在config.js中新增
"outlineSrcPath": path.join(__dirname, `../package/icons/outline/svg`)
验证与回滚
重命名完成后可通过以下命令验证结果:
# 查看重命名后的文件列表
ls package/icons/fill/svg | grep "filled"
若需恢复原始命名,可修改rename-icon.js中的getNewFileName函数,移除目标后缀后重新执行脚本。
自定义扩展
通过修改scripts/helpers/fs-helper.js中的文件过滤逻辑,可实现更复杂的命名规则:
- 添加前缀标识
- 统一文件大小写
- 按图标类别分类命名
例如实现按类别命名:
// 修改getNewFileName函数
const getNewFileName = (srcFile, extension, category) =>
`${category}-${path.basename(srcFile, `.${extension}`)}.${extension}`;
总结
Eva Icons项目提供的Node.js脚本工具链,将图标批量重命名这类重复性工作简化为配置+执行的两步操作。通过灵活调整config.js和rename-icon.js,可满足不同项目的图标命名规范需求。建议配合Git版本控制使用,在执行批量操作前创建分支,确保数据安全。
项目中所有图标资源遵循MIT开源协议,可在LICENSE.txt中查看详细授权信息。
【免费下载链接】eva-icons A pack of more than 480 beautifully crafted Open Source icons. SVG, Sketch, Web Font and Animations support. 项目地址: https://gitcode.***/gh_mirrors/ev/eva-icons