microsoft / microsoft/vscode-codicons
How to use Icons in `package.json` for Language Icon
Nobody has claimed this yet.
- Dominant language
- Handlebars
- Stars
- 1.2k
- Forks
- 210
- Avg merge
- 43m
- Merged PRs (30d)
- 3
Description
Describe the bug
In package.json one can use icons like
...
"commands": [
{
"category": "Testplan Manager",
"command": "testplanManager.document.goTo",
"title": "Go to",
"icon": "$(arrow-right)"
},
...
But that doesn't work for languages:
...
"contributes": {
"languages": [
{
"id": "testplan",
"aliases": [ "Testplan" ],
"extensions": [ ".tp" ],
"configuration": "./language-configuration.json",
"icon": {
"dark": "$(arrow-right)",
"light": "$(arrow-right)"
}
}
],
...
Because there it seems we need to use SVG files. As you provide the SVG Sprite option:
<svg>
<use xlink:href="codicon.svg#add" />
</svg>
How to use this approach or another in package.json for language icons ?
To Reproduce
Steps to reproduce the behavior:
See description
Expected behavior
See description
Screenshots
If applicable, add screenshots to help explain your problem.
Environment
- OS: Mac
- VS Code Version:
Version: 1.97.2 (Universal)
Commit: e54c774e0add60467559eb0d1e229c6452cf8447
Date: 2025-02-12T23:20:35.343Z (2 wks ago)
Electron: 32.2.7
ElectronBuildId: 10982180
Chromium: 128.0.6613.186
Node.js: 20.18.1
V8: 12.8.374.38-electron.0
OS: Darwin arm64 23.6.0
Additional context
Add any other context about the problem here.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the language contribution in package.json and compare its icon fields with the command icon example. Review the codicon.svg#add sprite usage shown in the report, then establish whether $(...) syntax is supported for language icons and document the supported approach or reproduce the missing behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- vscode
- Domain
- tooling
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100