Shiki syntax highlight support

Feature request

Problem or desire

Prism syntax highlight is quite bad (highlight.js is bad too).

Proposal

Support Shiki.

Shiki has better syntax highlight because it uses TextMate grammar instead of shady regexp. It uses the same engine as in VS Code.

Implementation

I guess the only thing to do on doscify side, is to add a config option that allows to generate a different highlighter class prefix. That way all JS syntax highlighter could nearly be supported.

shiki: css class shiki
prism: css class language- prefix
highlightjs: css class hljs

https://shiki.style/guide/install#cdn-usage

@noraj

Hi @noraj , As per the requirement that customizing the code block class, I think it is feasible for now.
You could register a customer renderer for code.

   window.$docsify = {
        markdown: {
          renderer: {
            code({ text, lang }) {
              return /* customized code block */ `<pre data-lang="${lang}" class="shiki language-${lang}"><code class="lang-${lang} language-${lang}" tabindex="0">${text}</code></pre>`;
            },
          },
        },
    }

Not quite sure whether Shiki support static css add-on styling for code hightlight, glad to see ur feedback on it!

@noraj

Hello @noraj

Yes, I think so. I'm new to Docsify, and I've created a new project to try it out, but it doesn't seem to highlight anything.

@noraj

it uses TextMate grammar instead of shady regexp

@noraj TextMate grammars are regexp based?

Shiki support would be a nice upgrade, but the integration should probably account for its async highlighter setup and theme loading. A good first version could expose Shiki as an optional plugin that preloads configured languages/themes, then falls back gracefully when a language is missing. That keeps the core lightweight while giving users a path to modern highlighting.

Here's a plugin https://github.com/simochee/docsify-shiki

I also created a plugin: https://github.com/sy-records/docsify-shiki

Navigation Menu

Repository navigation

Shiki syntax highlight support #2530

Feature request

Problem or desire

Proposal

Implementation

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Shiki syntax highlight support #2530

Description

Feature request

Problem or desire

Proposal

Implementation

Activity

Koooooo-7 commented on Jul 18, 2025

AhmedAlaa4611 commented on Oct 3, 2025

RedCMD commented on Oct 3, 2025

hiSandog commented on Jun 30, 2026

sy-records commented on Jul 3, 2026

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions