Can't import the named export 'l' from non EcmaScript module

mermaid-js / mermaid

Generation of diagrams like flowcharts or sequence diagrams from text in a similar manner as markdown

https://mermaid.js.org

MIT License

72.28k stars 6.58k forks source link

Can't import the named export 'l' from non EcmaScript module #4171

Open SanoopM7 opened 1 year ago

SanoopM7 commented 1 year ago

Description

./node_modules/mermaid/dist/mermaid.core.mjs Can't import the named export 'l' from non EcmaScript module (only default export is available)

Steps to reproduce

while importing mermaid from mermaid got this error

Screenshots

No response

Code Sample

No response

Setup

Desktop

OS and Version: [Windows, Linux, Mac, ...]
Browser and Version: [Chrome, Edge, Firefox]

Smartphone

Device: [Samsung, iPhone, ...]
OS and Version: [Android, iOS, ...]
Browser and Version: [Chrome, Safari, ...]

Additional Context

No response

sidharthv96 commented 1 year ago

Please try with mermaid@10.0.3-alpha.1

jiazheng commented 1 year ago

It doesn't work.

BlitherBoom812 commented 1 year ago

I have also encountered this problem and failed to fix this.

stevemk14ebr commented 1 year ago

The issue is that mermaid uses an import from a .mjs file which is not recognized as an ESM bundle. You need to update your bundler, such as webpack, to support .mjs files.

https://stackoverflow.com/questions/71054449/cant-import-the-named-export-directive-from-non-ecmascript-module-only-defau https://stackoverflow.com/questions/64002604/how-to-make-create-react-app-support-mjs-files-with-webpack