Skip to content

How to use it with Shiki? #154

@mohit2152sharma

Description

@mohit2152sharma

I was trying to use this with shiki syntax highlighting, but couldn't find a mention in documents. It would be helpful if a document is added on how to. use it with shiki.

So far I am doing this, I have setup the carta object as follows:

import { code } from '@cartamd/plugin-code';
import { Carta } from 'carta-md';
import DOMPurify from 'isomorphic-dompurify';
import '@cartamd/plugin-code/default.css';

export const carta = new Carta({
	sanitizer: DOMPurify.sanitize,
	rehypeOptions: { allowDangerousHtml: true },
	extensions: [
		code({
			theme: {
				light: 'github-dark',
				dark: 'github-light'
			}
		})
	],
	shikiOptions: {
		themes: ['github-dark', 'github-light']
	}
});

And then i pass it to the Markdown component.

But it renders the code like following, I am pretty sure, I am missing something here. Any help is much appreciated.

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    questionFurther information is requested

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions