Skip to content

导入图标 ​

Iconify Tools 可以从多个来源导入图标。

使用方法 ​

下面列出的所有函数都是异步的。大多数函数会创建 IconSet 实例。

在使用 Iconify Tools 之前,你应该了解该包具有明确的设计偏好。某些 SVG 元素是不被允许的,会导致导入失败。请参阅 SVG 导入限制。

异步 ​

大多数函数都是异步的。

如果你不熟悉 JavaScript 中的异步函数,请查阅 Promise 类以及 async 和 await 关键字。

使用异步函数最简单的方式是将所有代码包裹在一个匿名异步函数中,然后使用 await 等待函数执行:

tsconst iconSet = await importDirectory('files/svg', {
   prefix: 'test',
});

要捕获错误,请使用 try 和 catch:

tslet iconSet: IconSet;
try {
   iconSet = await importDirectory('files/svg', {
       prefix: 'test',
   });
} catch (err) {
   console.error(`Failed to import directory:`, err);
   return;
}

可以查阅关于 async 和 await 的各种教程。YouTube 上有许多免费且优质的教程。

清理 ​

导入图标后,请确保对其进行验证。请参阅 cleanupSVG() 函数。

导入函数 ​

有多个用于导入图标的函数:

importDirectory() ​

函数 importDirectory() 和 importDirectorySync() 用于从目录导入 SVG 文件。

importFromFigma() ​

函数 importFromFigma() 用于从 Figma 文档导入图标。

导入单个图标 ​

为导入单个文件创建函数是多余的。你只需读取文件并创建 SVG 实例即可。

请参阅 导入 SVG 文档。

导入 Iconify 图标集 ​

为导入 IconifyJSON 数据创建函数同样是多余的。你只需读取文件并创建 IconSet 实例即可。

请参阅 导入 Iconify 图标集 文档。