JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 16170
  • Score
    100M100P100Q131103F
  • License MIT

A Showdown extension for highlight the code blocks.

Package Exports

  • showdown-highlight

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (showdown-highlight) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

showdown-highlight

Version Downloads

A Showdown extension for highlight the code blocks.

This package uses highlight.js to highlight code blocks in Showdown output. πŸš€

☁️ Installation

# Using npm
npm install --save showdown-highlight

# Using yarn
yarn add showdown-highlight

πŸ“‹ Example

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]
});

// 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>
//
// <p>Below we have a piece of JavaScript code:</p>
//
// <pre><code class="js language-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">sayHello</span> (<span class="hljs-params">msg, who</span>) </span>{
//     <span class="hljs-keyword">return</span> <span class="hljs-string">`<span class="hljs-subst">${who}</span> says: msg`</span>;
// }
// sayHello(<span class="hljs-string">"Hello World"</span>, <span class="hljs-string">"Johnny"</span>);
// </code></pre>

❓ Get Help

There are few ways to get help:

  1. Please post questions on Stack Overflow. 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. πŸ›

πŸ˜‹ How to contribute

Have an idea? Found a bug? See how to contribute.

πŸ’« Where is this library used?

If you are using this library in one of your projects, add it in this list. ✨

  • bloggify-markdown-highlight (by Bloggify)β€”Highlight code blocks in the Markdown code.
  • ember-showdown-highlightβ€”The default blueprint for ember-cli addons.
  • markdown2dash (by Bob)β€”Convert markdown files to Dash docset in CLI
  • swanky (by Rod Leviton)β€”A simple, flexible and powerful tool for creating beautiful documentation.
  • trumpdocβ€”# Features - πŸ˜„ Suuuupppper easy to build. Do not need any shiz to build.(such as webpack) - πŸ‘ Simple and powerful, pure React application - 😈 Manage your documentation like a president - πŸ“„ code-block styles

πŸ“œ License

MIT Β© Bloggify