SuperAPI AI 工具集

icons-src

编程与开发

查看项目

更新于 10-15 21:43

技能介绍

用途:icons-src 是 salesforcedx-vscode-services 的字体图标源目录,用于添加自定义 SVG 图标供字体生成,适用于为 VS Code 扩展新增图标。

主要能力:规定 SVG 图标格式,提供 icons.json 清单登记,通过构建脚本生成字体与相关工件,并支持图标一致性测试。

SVG 要求:viewBox 仅限 0 0 24 24;xmlns 为 http://www.w3.org/2000/svg;内层 <g> 使用 fill="currentColor" 以便主题控制颜色;将路径包在 <g fill="currentColor" transform="scale(X)"> 中并调整 scale 使字形适配 24×24。外部来源图标可能过于复杂,需在矢量编辑器中简化或替换。应避免硬编码填充色、非 24×24 的 viewBox,以及未用 stroke="currentColor" 的描边。

使用流程:添加 SVG 到 media/icons-src/<name>.svg(名称小写、无空格);按 icons.json 格式在 media/icons-src/icons.json 追加条目,含 key、id、description;运行 npm run build:icons -w salesforcedx-vscode-services,检查 git diff;在 src/vscode/mediaService.ts 的 ICONS 与 ICON_DESCRIPTION_KEYS 中添加常量并按需加 i18n 键;若 services-types 依赖 ICONS,运行其 generate 脚本重新生成类型。

icons.json 格式为 key 映射到 {id, description},追加顺序影响 0xe001 等码点分配;key 为去 .svg 的文件名,id 为 VS Code 图标 ID(自定义图标用 sf-org-*),description 用于 contributes.icons。

工件变化:SVG 与 icons.json 需手动增删;package.json 的 contributes.icons、resources/icons-font/* 由 build:icons 自动更新;mediaService.ts 与 i18n 消息、services-types 的 icons.ts 需手动更新。

验证:运行 npm run test -w salesforcedx-vscode-services,iconConsistency.test.ts 校验 SVG、icons.json、contributes.icons 与 ICONS 常量是否一致。