Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mermaid 9.2.0 triggers webpack import warning #3757

Closed
matchaxnb opened this issue Nov 4, 2022 · 8 comments
Closed

Mermaid 9.2.0 triggers webpack import warning #3757

matchaxnb opened this issue Nov 4, 2022 · 8 comments
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect

Comments

@matchaxnb
Copy link

Description

When I import Mermaid in my Webpack project (based on backstage with plugin techdocs-addon-mermaid, 9.2.0 triggers a warning.

Compiled with problems:X

WARNING in ../../node_modules/mermaid/dist/mermaid.core.mjs 27645:52-67

Critical dependency: the request of a dependency is an expression


WARNING in ../../node_modules/mermaid/dist/mermaid.core.mjs 27659:52-63

Critical dependency: the request of a dependency is an expression

After investigating, it seems this is due to uses of await import(url) and await import(diagram), url and diagram being dynamic. Webpack sees that as bad.

I would recommend

Steps to reproduce

  1. Use Mermaid 9.2.0 in a project that uses Webpack 5.7.0

  2. Build in development mode

  3. See the issue
    or

  4. Install Backstage with Yarn 3 and up-to-date packages

  5. Install plug-in https://github.com/johanneswuerbach/backstage-plugin-techdocs-addon-mermaid but set MermaidJS version to 9.2.0

  6. run yarn dev

  7. see the error in the web UI.

Screenshots

No response

Code Sample

No response

Setup

Desktop

  • OS and Version: ArchLinux x86_64
  • Browser and Version: Chrome 106
  • Built with NodeJS 16, Webpack 5.7.0, Yarn 3.

Additional Context

No response

@matchaxnb matchaxnb added Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect labels Nov 4, 2022
@Just-Sieb
Copy link

I was having the same problem with our Backstage instance and trying to add that plugin in. I resolved the issue for now by setting the resolution in the top level package.json to lock it to Mermaid v9.1.1. It seems that this change

{
  ...
  "resolutions": {
    "mermaid": "9.1.1"
  },
  ...
}

I am guessing PR #3591 broke Webpack being able to import Mermaid

@Just-Sieb
Copy link

This is also probably a duplicate of #3754

@boldt
Copy link

boldt commented Nov 8, 2022

FYI: Even with 9.2.1, I still see Critical dependency: the request of a dependency is an expression.

@sidharthv96
Copy link
Member

But the fix for that is in #3774, which hasn't been merged yet due to pnpm issue.

@boldt
Copy link

boldt commented Nov 8, 2022

Thanks, but the release notes say, that this MR ist fixed:

fix #3757 : Remove dynamic imports for lazy load causing issues for webpack

@sidharthv96
Copy link
Member

image

Must've been a mistake, Struck it off.

@sidharthv96
Copy link
Member

Can you please test 9.2.2-rc.2

erikhofer added a commit to scope42/scope42 that referenced this issue Nov 9, 2022
@boldt
Copy link

boldt commented Nov 9, 2022

9.2.2 works for me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect
Projects
None yet
Development

No branches or pull requests

4 participants