github profile 技能图标生成器

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 443 天前的主题，其中的信息可能已经有所发展或是发生改变。

早上想更新一下 github profile 发现写 skill icon 很麻烦，花了几分钟写了一个 Skill Icon Generate
效果如下，如果您也跟我一样是个懒人，可以尝试使用这个项目快速定义技能图标
项目地址

https://github.com/GeekyWizKid/skill-icon-generate
效果

第 1 条附言 · 2023-09-12 14:03:48 +08:00

Usage

Clone this repo
Install dependencies

npm install

Run the script

node app.js

Open http://localhost:3000/ in your browser
Select the icon you want to generate
Copy the generated code and paste it into your GitHub profile

10 条回复 • 2023-09-12 16:22:35 +08:00

theprimone

2023-09-12 13:47:48 +08:00

没太看懂，如果只是预览图标的话，用 https://icones.js.org/collection/skill-icons 不也挺好？

passive

2023-09-12 13:48:38 +08:00 via Android

江湖杂耍：刀枪剑戟，斧钺钩叉，镋棍槊棒，鞭锏锤抓，拐子流星，带尖儿，带刺儿的，带锁链儿的，带倒齿钩的，带峨嵋刺儿的…

LDa

2023-09-12 13:58:33 +08:00

@theprimone 嗯是我没描述清楚，就是选择图标后在底下会生成一段 markdown 文本段直接拷到 README 就能用了

LDa

2023-09-12 13:59:13 +08:00

@theprimone [![My Skills]( https://skillicons.dev/icons?i=bash,c,cpp,css,codepen,git,github,idea,java,javascript,linux,python,vscode&theme=light)]( https://skillicons.dev)

LDa

2023-09-12 14:01:15 +08:00

@passive 继斜杠青年后流行 skill icon 青年了 😄

theprimone

2023-09-12 14:44:44 +08:00

那哪里还用得着 node 启动啊，随便找个静态站点部署一下多好，所见即所得多好。

theprimone

2023-09-12 14:46:20 +08:00

另外看到官方 Image Builder 都 Coming Soon 了，不知道效果咋样，不过你这么一说，我也整点图标玩玩，哈哈。

LDa

2023-09-12 14:58:51 +08:00

@theprimone 原始版本我是让 chatgpt 写的，能跑我也懒得改了哈哈哈

theprimone

2023-09-12 15:06:10 +08:00

@dasvenxx 这么一说，GPT 写了你改了多少？

LDa

2023-09-12 16:22:35 +08:00

1. const skill = icon.replace('.svg', '').toLocaleLowerCase().replace(/-(light|dark)$/, '');
增加了 .toLocaleLowerCase().replace(/-(light|dark)$/, '');
2. const markdown = \`[![My Skills]( https://skillicons.dev/icons?i=\`+skillList+\`&theme=\`+themeSelect+\`)]( https://skillicons.dev)\`;
将${} 修改为字符串拼接