[BUG] require() of ES Module Error with @mdx-js/mdx when using @douyinfe/semi-ui v2.66.1 #2512
Open
1 task done
Comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Is there an existing issue for this?
Which Component
No response
Semi Version
2.66.1
Current Behavior
当我使用 @douyinfe/semi-ui v2.66.1 在 Next.js 项目中时，遇到了 require() 无法加载 ES 模块的问题。具体来说，错误发生在尝试从 @douyinfe/semi-foundation/lib/cjs/markdownRender/foundation.js 文件中加载 @mdx-js/mdx/index.js 时。
Expected Behavior
No response
Steps To Reproduce
1、创建一个新的 Next.js 应用程序。
2、安装 @douyinfe/semi-ui v2.66.1。
3、import { Button } from '@douyinfe/semi-ui'。
4.、<Button theme='light' type='primary' style={{ marginRight: 8 }}>Deploy now
ReproducibleCode
import Head from "next/head"; import Image from "next/image"; import localFont from "next/font/local"; import styles from "@/styles/Home.module.css"; import { Button } from '@douyinfe/semi-ui'; const geistSans = localFont({ src: "./fonts/GeistVF.woff", variable: "--font-geist-sans", weight: "100 900", }); const geistMono = localFont({ src: "./fonts/GeistMonoVF.woff", variable: "--font-geist-mono", weight: "100 900", }); export default function Home() { return ( <> <Head> <title>Create Next App</title> <meta name="description" content="Generated by create next app" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="icon" href="/favicon.ico" /> </Head> <div className={`${styles.page} ${geistSans.variable} ${geistMono.variable}`} > <main className={styles.main}> <Image className={styles.logo} src="https://nextjs.org/icons/next.svg" alt="Next.js logo" width={180} height={38} priority /> <ol> <li> Get started by editing <code>pages/index.tsx</code>. </li> <li>Save and see your changes instantly.</li> </ol> <div className={styles.ctas}> <a className={styles.primary} href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app" target="_blank" rel="noopener noreferrer" > <Image className={styles.logo} src="https://nextjs.org/icons/vercel.svg" alt="Vercel logomark" width={20} height={20} /> <Button theme='light' type='primary' style={{ marginRight: 8 }}>Deploy now</Button> </a> <a href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app" target="_blank" rel="noopener noreferrer" className={styles.secondary} > Read our docs </a> </div> </main> <footer className={styles.footer}> <a href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app" target="_blank" rel="noopener noreferrer" > <Image aria-hidden src="https://nextjs.org/icons/file.svg" alt="File icon" width={16} height={16} /> Learn </a> <a href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app" target="_blank" rel="noopener noreferrer" > <Image aria-hidden src="https://nextjs.org/icons/window.svg" alt="Window icon" width={16} height={16} /> Examples </a> <a href="https://nextjs.org?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app" target="_blank" rel="noopener noreferrer" > <Image aria-hidden src="https://nextjs.org/icons/globe.svg" alt="Globe icon" width={16} height={16} /> Go to nextjs.org → </a> </footer> </div> </> ); }Environment
Anything else?
No response
The text was updated successfully, but these errors were encountered: