Diagrams are not rendered

[clabnet]

Hi,

I still using vitepress-plugin-mermaid 2.0.16 with mermaid 10.9.1, vitepress 1.2.2 and vue 3.4.27 with this code

When I use this .vitepress\config.ts

import { withMermaid } from "vitepress-plugin-mermaid";
export default withMermaid({
  themeConfig: {...}, 
  mermaid: {  },  <-- empty object
  mermaidPlugin: {  }, <-- empty object
  ...
})   

the vitepress page is not open, with this error on console :

SyntaxError: The requested module '/@fs/D:/src/test-doc/node_modules/.pnpm/dayjs@1.11.11/node_modules/dayjs/dayjs.min.js?v=cccddaad' does not provide an export named 'default' (at mermaid-6dc72991.js?v=cccddaad:2:8)

When I use this .vitepress\config.ts

export default defineConfig({
  themeConfig: {...}, 
  mermaid: {  },  <-- empty object
  mermaidPlugin: {  }, <-- empty object
  ...
})   

the diagram is not rendered, the result is :

I'm still missing any things ?

[brc-dd]

Are you using pnpm? Use it with shamefully-hoist. It works fine with npm -

https://stackblitz.com/edit/vite-ny7pvh?file=docs%2F.vitepress%2Fconfig.ts,docs%2Findex.md

[clabnet]

Thank you @brc-dd, you are right. Adding shamefully-hoist=true to .npmrc the issue was resolved.

Or elsewhere are need to install these dependencies :

    "@braintree/sanitize-url": "^7.0.2",
    "cytoscape": "^3.29.2",
    "cytoscape-cose-bilkent": "^4.1.0",
    "dayjs": "^1.11.11",
    "debug": "^4.3.4",

[p-chan]

Hi everyone,

I faced similar issues and found that using public-hoist-pattern provided a more controlled solution. Here’s what worked for me:

.npmrc

public-hoist-pattern[]=@braintree/sanitize-url
public-hoist-pattern[]=cytoscape
public-hoist-pattern[]=cytoscape-cose-bilkent
public-hoist-pattern[]=*eslint*
public-hoist-pattern[]=*prettier*

This setup ensures that only necessary dependencies are hoisted, avoiding broader conflicts. Hope this helps!