@jonny/docusaurus-preset-shiki-twoslash
v1.1.36
Published
A Docusaurus plugin which adds shiki with optional twoslash-powered code samples
Downloads
12
Readme
Docusaurus Preset Shiki Twoslash
Sets up markdown code blocks to run through shiki which means it gets the VS Code quality syntax highlighting mixed with the twoslash JavaScript tooling from the TypeScript website.
Setup
Install the dependency:
yarn add docusaurus-preset-shiki-twoslash
Include
"docusaurus-preset-shiki-twoslash"
in the presets section ofdocusaurus.config.js
presets: [ [ '@docusaurus/preset-classic', { // ... }, ], + [ + 'docusaurus-preset-shiki-twoslash', + { + themes: ["min-light", "nord"], + }, + ], ],
Set up light/dark mode CSS in
src/css/custom.css
:
[data-theme="light"] .shiki.nord {
display: none;
}
[data-theme="dark"] .shiki.min-light {
display: none;
}
- Go read npmjs.com/package/remark-shiki-twoslash to see what is available, this package leaves all the heavy work to that module.