search

DouyinFE / semi-design

🚀A modern, comprehensive, flexible design system and React UI library. 🎨 Provide more than 3000+ Design Tokens, easy to build your design system. Make Semi Design to Any Design. 🧑🏻‍💻 Design to Code in one click
https://semi.design
Other
8.47k stars 716 forks source link

Issue with ES Module Import in @douyinfe/semi-foundation #2511

Open 1241751430 opened 1 month ago

1241751430 commented 1 month ago

Is there an existing issue for this?

Which Component

I am encountering an issue when building my Next.js application that uses the @douyinfe/semi-ui library. The error message indicates a problem with importing an ES Module in the @douyinfe/semi-foundation package.

Semi Version

No response

Current Behavior

Error: require() of ES Module C:\Users\Administrator\Desktop\witcube\frontend\node_modules\@mdx-js\mdx\index.js from C:\Users\Administrator\Desktop\witcube\frontend\node_modules\@douyinfe\semi-foundation\lib\cjs\markdownRender\foundation.js not supported. Instead change the require of index.js in C:\Users\Administrator\Desktop\witcube\frontend\node_modules\@douyinfe\semi-foundation\lib\cjs\markdownRender\foundation.js to a dynamic import() which is available in all CommonJS modules.

Expected Behavior

I expected the build process to complete without errors, as I am using compatible versions of the dependencies.

Steps To Reproduce

Install the @douyinfe/semi-ui package in a Next.js project. Run yarn build. Observe the error message related to ES module imports.

ReproducibleCode

Error: require() of ES Module C:\Users\Administrator\Desktop\witcube\frontend\node_modules\@mdx-js\mdx\index.js from C:\Users\Administrator\Desktop\witcube\frontend\node_modules\@douyinfe\semi-foundation\lib\cjs\markdownRender\foundation.js not supported. Instead change the require of index.js in C:\Users\Administrator\Desktop\witcube\frontend\node_modules\@douyinfe\semi-foundation\lib\cjs\markdownRender\foundation.js to a dynamic import() which is available in all CommonJS modules.

Environment

Node.js Version: 20.11.0
Next.js Version: 12.3.4

Anything else?

No response

pointhalo commented 1 month ago

mdx/js is a pure esm module, there is no cjs version Try to find the configuration of nextJs to see if there is a related switch to enable pure esm