You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I would like to add mermaid diagrams to my documentation.
Motivation for or Use Case
Sometimes an images says more that a thousand words, that is why we would like to add mermaid diagrams to our documentation. Currently mermaid is not support by Compodoc while I think it is a nice feature a lot of people would benefit from.
For everyone else waiting on this feature, here is a patch solution based on @matteopini-horsa's proposed changes
Step 1) create file patch-compodoc.js & add the code below
#!/usr/bin/env node
constfs=require('fs');constcompoMod=`${process.cwd()}/node_modules/@compodoc/compodoc`;constupdates=[{// filename 'index-cli-Cr-tk_1e.js' is unique to compodoc v1.1.24, this will need to be updated to reflect the correct path for whichever version you're ontarget: `${compoMod}/dist/index-cli-Cr-tk_1e.js`,search: `if (!language) {`,replace: `if (language === 'mermaid') { // setting the mermaid css class will enable the diagram to be rendered return '<div class="mermaid">'+code+'</div>'; } if (!language) {`,},{target: `${compoMod}/src/templates/page.hbs`,search: `<script src="{{relativeURL data.depth }}js/lazy-load-graphs.js"></script>`,replace: `<script src="{{relativeURL data.depth }}js/lazy-load-graphs.js"></script> <!-- loading mermaid library --> <script src=" 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs'"></script>`,},];for(constupdateofupdates){constdata=fs.readFileSync(update.target);constpatched=data.toString().replace(update.search,update.replace);fs.writeFileSync(update.target,patched);}console.log('successfully patched compodoc');
Step 2) update your docs script to something like below
Overview of the feature
I would like to add mermaid diagrams to my documentation.
Motivation for or Use Case
Sometimes an images says more that a thousand words, that is why we would like to add mermaid diagrams to our documentation. Currently mermaid is not support by Compodoc while I think it is a nice feature a lot of people would benefit from.
Related issues
This feature is requested before in #600 and #1278 and @matteopini-horsa even showed how this could be implemented with a few lines of code (https://github.com/compodoc/compodoc/pull/1278/files). This example shows that is a small change which shouldn't break any features.
If there is any more work that needs to be done to merge this feature please let me know, I'm happy to do this work since we really love Compodoc!
The text was updated successfully, but these errors were encountered: