MarkdownIt plugin for highlighting inline code snippets using Prism.
npm install markdown-it-prism-backticksMarkdownIt plugin for highlighting inline code snippets using Prism.
Using npm:
```
npm install markdown-it-prism-backticks
Prism is a peer dependency of this plugin and must also be installed:
``
npm install prismjs
Import it wherever you configure MarkdownIt and then use it as you would any other MarkdownIt plugin:
`js
import MarkdownIt from "markdown-it";
import markdownItPrismBackticks from "markdown-it-prism-backticks";
...
new MarkdownIt().use(markdownItPrismBackticks)
`
Important! You may also need to import Prism itself. If you are using the markdown-it-prism plugin as well then you do not. If you are already importing Prism then you do not. If neither situation applies then you do need to import Prism:
`js`
import "prismjs"; // Ensure the Prism global object is defined.
import MarkdownIt from "markdown-it";
import markdownItPrismBackticks from "markdown-it-prism-backticks";
Now you can add a language annotation to any inline backticks content that you want highlighted by Prism:
`markdownLDA #$22
An example assembly instruction is {lang=asm6502}.`
The result is as expected:
![]()
(The exact visual appearance will depend on the Prism theme that you are using.)
The rules for the language annotation are simple:
- No whitespace between the closing backtick and the opening curly brace.
- No whitespace in the language annotation.
See stevejay/middleengine-website for an example of a repository that uses this plugin.
This plugin can be used in conjunction with the markdown-it-prism plugin. The latter highlights fenced code blocks while this plugin highlights inline backtick content.
This plugin plays well with the markdown-it-attrs plugin. Any content in curly braces that does not match the {lang=some-lang} format is ignored by this plugin, and you can add extra curly brace content for markdown-it-attrs after the language setting:
`markdownLDA #$22
This is fine: {.someClass}.
This is also fine: LDA #$22{lang=asm6502}{.someClass}.``
The basic approach to parsing inline backticks comes from the default parser in the MarkdownIt repository.
The structure of this repository comes from the markdown-it-prism project.