KO | EN

GitLite

Minimalist Open Source Repository Search Engine

gitlite — search

#dsh #dsh-plugin #ai-agent #developer-tools #codex #typescript #cli #deepseek-harness #claude-code #ai-agents #mcp #rust

showdown-highlight

★ 56 Open GitHub ↗

:art: A Showdown extension for highlighting code blocks.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# showdown-highlight

[![Version](https://img.shields.io/npm/v/showdown-highlight.svg)](https://www.npmjs.com/package/showdown-highlight) [![Downloads](https://img.shields.io/npm/dt/showdown-highlight.svg)](https://www.npmjs.com/package/showdown-highlight)

> A Showdown extension for highlight the code blocks.

This package uses [`highlight.js`](https://highlightjs.org) to highlight code blocks in [Showdown](https://github.com/showdownjs/showdown) output. :rocket:

## :cloud: Installation

```sh
# Using npm
npm install --save showdown-highlight

# Using yarn
yarn add showdown-highlight
```

## :clipboard: Example

```js
const showdown = require('showdown')
    , showdownHighlight = require("showdown-highlight")
    ;

// After requiring the module, use it as extension
let converter = new showdown.Converter({
 // That's it
 extensions: [showdownHighlight({
 // Whether to add the classes to the <pre> tag, default is false
 pre: true
 // Whether to use hljs' auto language detection, default is true
 , auto_detection: true
 })]
});

// Now you can Highlight code blocks
let html = converter.makeHtml(`
## Highlighting Code with Showdown

Below we have a piece of JavaScript code:

\`\`\`js
function sayHello (msg, who) {
    return \`\${who} says: msg\`;
}
sayHello("Hello World", "Johnny");
\`\`\`
`);

console.log(html);
// <h2 id="highlightingcodewithshowdown">Highlighting Code with Showdown</h2>
//
// Below we have a piece of JavaScript code:
//
// <pre><code class="js language-js">function sayHello (msg, who) {
// return `${who} says: msg`;
// }
// sayHello("Hello World", "Johnny");
// </code></pre>
```

## :question: Get Help

There are few ways to get help:

1. Please [post questions on Stack Overflow](https://stackoverflow.com/questions/ask). You can open issues with questions, as long you add a link to your Stack Overflow question.
 2. For bug reports and feature requests, open issues. :bug:

## :memo: Documentation

### `showdownHighlight()`
Highlight the code in the showdown input.

Examples:

```js
let converter = new showdown.Converter({
    extensions: [showdownHighlight]
})
```

Enable the classes in the `<pre>` element:

```js
let converter = new showdown.Converter({
    extensions: [showdownHighlight({ pre: true })]
})
```

If you want to disable language [auto detection](https://highlightjs.org/usage/)
feature of hljs, change `auto_detection` flag as `false`. With this option
turned off, `showdown-highlight` will not process any codeblocks with no
language specified.

```js
let converter = new showdown.Converter({
    extensions: [showdownHighlight({ auto_detection: false })]
})
```

## :yum: How to contribute
Have an idea? Found a bug? See [how to contribute][contributing].

## :dizzy: Where is this library used?
If you are using this library in one of your projects, add it in this list. :sparkles:

- `mdpdf`
 - `bloggify-markdown-highlight`
 - `github-readme-to-html`
 - `md-toy-blog`
 - `@kev_nz/publisher`
 - `@etermind/alex`
 - `@siradoc/siradoc`
 - `@web-native-js/chtml-cli`
 - `swanky`
 - `md-srv`
 - `docset-tools-markdown`
 - `callete`
 - `teroshdl2`
 - `ui_kitchenadmincenter`
 - `trumpdoc`
 - `@peersky/next-web3-chakra`
 - `mdpdf_jm`
 - `textbase`
 - `teroshdl`
 - `showdown-html`
 - `busi-ui`
 - `md-browse`
 - `markdown2dash`
 - `tutors-reader-lib`
 - `tutors-html-beta`
 - `tutors-html`
 - `examma-ray`
 - `steelsky`
 - `chimpsky`
 - `ember-showdown-highlight`
 - `showit`
 - `tutors-html-alpha`

## :scroll: License

[license]: /LICENSE
[website]: https://bloggify.org
[contributing]: /CONTRIBUTING.md
[docs]: /DOCUMENTATION.md

showdown-highlight

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README