使用chakra-ui和next.js时，Object.fromEntries不是函数错误
使用chakra-ui和next.js时，Object.fromEntries不是函数错误
提问于 2021-05-16 04:22:12
我使用Vercel创建了一个next.js应用程序，然后使用以下命令行安装了chakra-ui：
npm i @chakra-ui/react @emotion/react@^11 @emotion/styled@^11 framer-motion@^4
它导致了以下错误：
TypeError: Object.fromEntries is not a function
at inner (/Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/utils/dist/cjs/walk-object.js:21:21)
at /Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/utils/dist/cjs/walk-object.js:24:22
at Array.map (<anonymous>)
at inner (/Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/utils/dist/cjs/walk-object.js:21:55)
at /Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/utils/dist/cjs/walk-object.js:24:22
at Array.map (<anonymous>)
at inner (/Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/utils/dist/cjs/walk-object.js:21:55)
at walkObject (/Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/utils/dist/cjs/walk-object.js:31:10)
at createThemeVars (/Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/styled-system/dist/cjs/create-theme-vars/create-theme-vars.js:19:25)
at toCSSVar (/Users/vaibhavverma9/Desktop/tcofrontend/node_modules/@chakra-ui/styled-system/dist/cjs/create-theme-vars/to-css-var.js:28:64)我试着修改节点模块……以下是我的依赖项：
"dependencies": {
"@chakra-ui/react": "^1.6.1",
"@emotion/react": "^11.4.0",
"@emotion/styled": "^11.3.0",
"@types/react": "^17.0.5",
"framer-motion": "^4.1.16",
"next": "10.2.0",
"react": "17.0.2",
"react-dom": "17.0.2",
"typescript": "^4.2.4"
}这是我的pages/_app.tsx文件：
import '../styles/globals.css'
import { ChakraProvider } from "@chakra-ui/react"
function MyApp({ Component, pageProps }) {
return (
<ChakraProvider>
<Component {...pageProps} />
</ChakraProvider>
)
}
export default MyApp我将index.tsx保留为默认设置：
import Head from 'next/head'
import Image from 'next/image'
import styles from '../styles/Home.module.css'
export default function Home() {
return (
<div className={styles.container}>
<Head>
<title>Create Next App</title>
<meta name="description" content="Generated by create next app" />
<link rel="icon" href="/favicon.ico" />
</Head>
<main className={styles.main}>
<h1 className={styles.title}>
Welcome to <a href="https://nextjs.org">Next.js!</a>
</h1>
<p className={styles.description}>
Get started by editing{' '}
<code className={styles.code}>pages/index.js</code>
</p>
<div className={styles.grid}>
<a href="https://nextjs.org/docs" className={styles.card}>
<h2>Documentation →</h2>
<p>Find in-depth information about Next.js features and API.</p>
</a>
<a href="https://nextjs.org/learn" className={styles.card}>
<h2>Learn →</h2>
<p>Learn about Next.js in an interactive course with quizzes!</p>
</a>
<a
href="https://github.com/vercel/next.js/tree/master/examples"
className={styles.card}
>
<h2>Examples →</h2>
<p>Discover and deploy boilerplate example Next.js projects.</p>
</a>
<a
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
className={styles.card}
>
<h2>Deploy →</h2>
<p>
Instantly deploy your Next.js site to a public URL with Vercel.
</p>
</a>
</div>
</main>
<footer className={styles.footer}>
<a
href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
Powered by{' '}
<span className={styles.logo}>
<Image src="/vercel.svg" alt="Vercel Logo" width={72} height={16} />
</span>
</a>
</footer>
</div>
)
}有人知道我如何解决这个错误吗？
回答 3
Stack Overflow用户
回答已采纳
发布于 2021-05-16 04:53:23
我不得不更新我的节点版本，它是v10.17.0。我把它更新到了v14.17.0！
Stack Overflow用户
发布于 2021-05-25 13:45:50
是的，我在这种情况下遇到了问题，我通过将节点版本从v10更新到v14解决了这个问题，它工作得很顺利。
您可以在nvm中使用快速命令
nvm install v14如果它可用：
nvm use 14希望你也是！
Stack Overflow用户
发布于 2021-08-23 11:30:11
检查您的Node.js是否低于v12.0.0版本。如果是，则使用Object.fromEntries() is not supported。
选项#1:升级到高于12.0.0的Node JS版本。
选项#2:不要调用Object.fromEntries()，而是像这样使用一个只有6行长的polyfill/polyfill：https://github.com/feross/fromentries/blob/master/index.js (归功于原始作者)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67550901
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号