inline hints for shiki powered code blocks
I'm experimenting with adding inline hints to indicate stuff like parameter names in code example on the documentation I'm writing. I got a shiki custom transformer going to replace inline comments that look like
/* [!hint: prop:] */
by prop:
. Obviously they get automatically removed from the copy code
functionality.
I personally like those in my IDE as it makes it easier to understand what is what on function calls, but some questions comes to mind :
- is it helpful on a code example ?
- should I add a way to hide them ?
- are they readable enough ?
- is it clear enought that they aren't actually part of the code ?

2 Replies
Webstorm shows hints like this automatically, and I love the feature. However, many beginners following tutorials that show such hints think it's part of the code, and they get syntax errors when writing the hints as part of their code. I do not advise showing them in tutorials.
I wanted to have them on the guide pages but not on the step by step tutorial I'm planning to add later on