Skip to content

Support Mermaid ChartΒ #94

@mzvast

Description

@mzvast

Hi! πŸ‘‹

Firstly, thanks for your work on this project! πŸ™‚

Feature Description

I'm working on a react app to make mdx to show mermaid chart as it's really good to draw all sorts of charts.
However I've no idea how to extend the remarkPluingin without touch the source code.

Here is the diff that solved my problem:

diff --git a/node_modules/mdx-loader/index.js b/node_modules/mdx-loader/index.js
index 60c954a..bc0c9a6 100644
--- a/node_modules/mdx-loader/index.js
+++ b/node_modules/mdx-loader/index.js
@@ -10,6 +10,7 @@ const mdxExportJSONByDefault = require('mdx-constant')
 const grayMatter = require('gray-matter')
 const typography = require('./typography')
 const rehypePrism = require('./prism')
+const mdxMermaid = require('mdx-mermaid')
 
 module.exports = async function(source) {
   let result
@@ -18,6 +19,7 @@ module.exports = async function(source) {
   const options = Object.assign(
     {
       remarkPlugins: [
+        mdxMermaid,
         slug,
         images, 
         emoji,

This issue body was partially generated by patch-package.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions