docsify/docs/markdown.md
John Hildenbiddle f5412dc7b0
chore: Update lint configuration (ESLint 9, Prettier 3) (#2438)
* Update linting configuration (eslint, prettier)

* Fix lint issues following eslint prettier update

* Change ESLint config to allow boolean coercion

* Switch to default import name per docs

* Fix suppression of error details

* Update JSDoc comments

* Update waiForFunctin to provide error details

---------

Co-authored-by: Koy Zhuang <koy@ko8e24.top>
2024-05-28 15:27:29 -05:00

1.2 KiB

Markdown configuration

docsify uses marked as its Markdown parser. You can customize how it renders your Markdown content to HTML by customizing renderer:

window.$docsify = {
  markdown: {
    smartypants: true,
    renderer: {
      link() {
        // ...
      },
    },
  },
};

?> Configuration Options Reference: marked documentation

You can completely customize the parsing rules.

window.$docsify = {
  markdown(marked, renderer) {
    // ...

    return marked;
  },
};

Supports mermaid

// Import mermaid
//  <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.css">
//  <script src="//cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

let num = 0;
mermaid.initialize({ startOnLoad: false });

window.$docsify = {
  markdown: {
    renderer: {
      code(code, lang) {
        if (lang === 'mermaid') {
          return /* html */ `
            <div class="mermaid">${mermaid.render(
              'mermaid-svg-' + num++,
              code,
            )}</div>
          `;
        }
        return this.origin.code.apply(this, arguments);
      },
    },
  },
};