mjbvz / vscode-markdown-shiki

Uses Shiki for VS Code's built-in markdown preview syntax highlighting

Uses Shiki for code highlighting in VS Code's builtin markdown preview. This makes the preview's colors better match what you see in VS Code text editor.

Configuration

markdownShiki.theme

The color theme to use in the preview:

• "abyss"
• "dark_plus" (default)
• "dark_vs"
• "hc_black"
• "kimbie_dark"
• "light_plus"
• "light_vs"
• "monokai"
• "monokai_dimmed"
• "quietlight"
• "red"
• "solarized_dark"
• "solarized_light"
• "Material-Theme-Darker-High-Contrast"
• "Material-Theme-Darker"
• "Material-Theme-Default-High-Contrast"
• "Material-Theme-Default"
• "Material-Theme-Lighter-High-Contrast"
• "Material-Theme-Lighter"
• "Material-Theme-Ocean-High-Contrast"
• "Material-Theme-Ocean"
• "Material-Theme-Palenight-High-Contrast"
• "Material-Theme-Palenight"
• "nord"
• "min-light"
• "min-dark"
• "white"
• "white-night"
• "zeit

vscode-markdown-shiki's Issues

Array declarations in go block code are not highlighted

Here some code colors are lost on line 6:

Originally posted by @larhun in #4 (comment)

Python highlighting doesn't match Light+ and Dark+

The extension works for any theme but Light+ and Dark+, which are the only 2 I use. I have only tried python

!! Considerable lag when modifying file while its preview is open in another editor

Only lags in files with fenced code blocks when syntax highlighting is applied. I've mostly been using ```cpp, but it appears to be reproducible in any language.
Issue is the same regardless of whether or not the preview is actually being displayed (i.e. split-screen vs unfocused tab).

Renders this otherwise wonderful plugin unusable! Let me know what I can do to help.

Code v1.63.2

Take into account `editor.fontFamily`

While the extension styles Markdown code blocks using the editor's theme, it does not take into account various settings that influence the presentation of text within the editor (e.g., editor.fontFamily, etc.).

Code color(not colored) sets to editor.foreground instead of #000000

Steps to reproduce:

1. Install C/C++ Themes and use the theme
2. Install Markdown Preview VS Code Highlighting
3. Create a new Markdown file and type these:

```bash
sh build.sh p3
```
```cpp
#include <iostream>
using namespace std;
int main(){
    cout << "Hello World";
}
```

4. Can't see some texts because the color is #000000

I studied about this months ago. In my opinion, if the theme developers don't specify this below in their json theme file:

"tokenColors":[
  {
    "name": "Global settings",
    "settings": {
      "foreground": "#ffffff" // If they specify it with editor.foreground hex code, the black texts will change back to the properly color that matches the bg color.
    }
  }
]

, the texts that they don't color through the TextMate's Scopes will stay #000000 even if it is a dark theme. And it's almost unable for me to read.
You can see more clearly through this picture: (Theme: Github Dark in Github Theme)

I wonder if there's a way to replace the foreground in TextMate token colors with editor.foreground the theme developer specified when the program reads the json file of the theme. I'm bad at JS/TS, so I would ask you if you can fix this.
Thank you for reading this!

Several languages are missing due to Shiki being out of date

Add support for new grammar injection in markdown code blocks

As shown in the example, the code highlighting for the new grammar superjs injected into a markdown code block only works in the VS Code text editor and is not applied in the VS Code markdown preview.

Could the shiki preview be applied to new grammars?

Add information to README for adding a new theme

Would love to add Gruvbox!

No longer highlighted background on code blocks

There's different background on markdown code blocks by default:

When extension enabled it's no longer true:

Use VS Code's current theme by default

It'd be nice if the we defaulted to using VS Code's current theme for highlighting

Two parts to this:

• Loading themes that Shiki already knows about
• Loading additional themes from disk

CSS line-height is too much for default dark theme

Thanks for this extension. Please see the screenshot, the line-height is way too much I think, especially compared to the original code. Would be great to get this fixed.

Power Query highlighting

Power Query highlighting doesn't seem to work. Am I doing something wrong?
Thanks

Markdown Syntax Highlighting not showing in preview

Issue Type: Bug

Previously it was working.
Now the fenced code blocks are not showing any syntax highlights in the VSCode Markdown preview.
The problem is I would like to preview the markdown file in its syntax highlight before pushing commits to Github. As can be seen, the syntax highlights are shown in Github.
Code example:

awesome = ["Papuchon", "curry", ":)"]   
also = ["Quake", "The Simons"]   
allAwesome = [awesome, also]

Extension version: 0.1.1
VS Code version: Code 1.49.0 (e790b931385d72cf5669fcefc51cdf65990efa5d, 2020-09-10T13:22:08.892Z)
OS version: Windows_NT x64 10.0.18363

System Info

Item	Value
CPUs	Intel(R) Core(TM) i7-6560U CPU @ 2.20GHz (4 x 2208)
GPU Status	2d_canvas: enabled flash_3d: enabled flash_stage3d: enabled flash_stage3d_baseline: enabled gpu_compositing: enabled multiple_raster_threads: enabled_on oop_rasterization: disabled_off opengl: enabled_on protected_video_decode: unavailable_off rasterization: enabled skia_renderer: disabled_off_ok video_decode: enabled vulkan: disabled_off webgl: enabled webgl2: enabled
Load (avg)	undefined
Memory (System)	15.59GB (7.06GB free)
Process Argv	--crash-reporter-id 524d91ad-a30b-412d-9eb0-27ef7d9f818a
Screen Reader	no
VM	0%