如何在VSCode扩展中为语言贡献使用内置图标？
如何在VSCode扩展中为语言贡献使用内置图标？
提问于 2022-10-19 12:41:43
我想使用https://code.visualstudio.com/api/references/icons-in-labels的内置图标之一。
package.json
...
"contributes": {
"languages": [{
...
"icon": {
"dark": "$(account)",
"light": "$(account)"
}
...
...结果根本没有图标：
我还试过account、$(accounts-view-bar-icon)和accounts-view-bar-icon。所有这些不同的语法和ID都不起作用。
回答 1
Stack Overflow用户
发布于 2022-10-19 13:16:22
找到了解决方案，但不确定这是否是正确的方法。
通过npm i @vscode/codicons
- Copy将Codicons ( https://github.com/microsoft/vscode-codicons )安装到扩展中，您想要使用的图标从
./node_modules/@vscode/codicons/src/icons到./src/icons
- Copy，其中一个用于
dark，另一个用于light
- Use，
package.json文件中的图标如：
"icon": {
"dark": "./src/icons/dark/account.svg",
"light": "./src/icons/light/account.svg"
}./icons/light/account.svg和
- 更改
.svg文件中的颜色
<svg
width="16"
height="16"
viewBox="0 0 16 16"
xmlns="http://www.w3.org/2000/svg"
fill="#478af5"> ...<svg
width="16"
height="16"
viewBox="0 0 16 16"
xmlns="http://www.w3.org/2000/svg"
fill="#1f2b40"> ...关于图标颜色变化的注意事项
如果事后更改了图标的颜色，则将package.json中使用的图标的名称更改为任何其他值，打包您的扩展名，将其更改为原始图标名，然后再次进行打包。否则，在VSCode中将不会发生颜色更改。似乎它会被缓存。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/74125516
复制相关文章
相似问题
腾讯云开发者
