我正在使用Next.js 12 ,并且在使用theme-ui创建主题后弹出此错误
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: E:\fm-nextjs\node_modules\@mdx-js\react\index.js
require() of ES modules is not supported.
require() of E:\fm-nextjs\node_modules\@mdx-js\react\index.js from E:\fm-nextjs\node_modules\@theme-ui\mdx\dist\theme-ui-mdx.cjs.dev.js
is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from E:\fm-nextjs\node_modules\@mdx-js\react\package.json.
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1089:13)
at Module.load (internal/modules/cjs/loader.js:937:32)
at Function.Module._load (internal/modules/cjs/loader.js:778:12) at Module.require (internal/modules/cjs/loader.js:961:19)
at require (internal/modules/cjs/helpers.js:92:18)
at Object.<anonymous> (E:\fm-nextjs\node_modules\@theme-ui\mdx\dist\theme-ui-mdx.cjs.dev.js:9:15)
at Module._compile (internal/modules/cjs/loader.js:1072:14)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
at Module.load (internal/modules/cjs/loader.js:937:32)
at Function.Module._load (internal/modules/cjs/loader.js:778:12) {
code: 'ERR_REQUIRE_ESM'
}
我的 package.json 具有以下依赖项
"dependencies": {
"@emotion/react": "^11.7.1",
"@emotion/styled": "^11.6.0",
"@mdx-js/react": "^2.0.0",
"@theme-ui/presets": "^0.13.1",
"next": "^12.0.10",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"theme-ui": "^0.13.1"
}
我尝试从中删除"type": "module"
,E:\fm-nextjs\node_modules\@mdx-js\react\package.json
但它仍然给出错误。
我该如何解决这个问题。好像我必须手动更改一堆文件。如果有解决方法会很棒。