这是我的Next.js项目,我使用npx create-next-app@latest博客创建了它,昨天它工作得很好,直到今天当我尝试使用yarn dev或npm run dev运行时,它们都给了我这个错误,我很确定我没有在我的文件夹中使用任何useContext,任何人都可以帮助我:
Server Error
TypeError: Cannot read properties of null (reading 'useContext')
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
Object.useContext
file:///C:/Users/User/Documents/Coding/Nextjs/tutorial/blog/node_modules/react/cjs/react.development.js (1618:21)
useContext
node_modules\next\dist\pages\_document.js (707:105)
renderWithHooks
file:///C:/Users/User/Documents/Coding/Nextjs/tutorial/blog/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5658:16)
renderIndeterminateComponent
file:///C:/Users/User/Documents/Coding/Nextjs/tutorial/blog/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5731:15)
renderElement
file:///C:/Users/User/Documents/Coding/Nextjs/tutorial/blog/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5946:7)
renderNodeDestructiveImpl
file:///C:/Users/User/Documents/Coding/Nextjs/tutorial/blog/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///C:/Users/User/Documents/Coding/Nextjs/tutorial/blog/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
下面是我的package.json文件:
{
"name": "blog",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"bcryptjs": "^2.4.3",
"eslint": "8.36.0",
"eslint-config-next": "13.2.4",
"formik": "^2.2.9",
"framer-motion": "^10.11.2",
"graphql": "^16.6.0",
"graphql-request": "^5.2.0",
"mongodb": "^5.2.0",
"mongoose": "^7.0.3",
"next": "^13.3.0",
"next-auth": "^4.20.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^4.8.0",
"react-spinners": "^0.13.8",
"react-toastify": "^9.1.2",
"swiper": "^9.1.1",
"swr": "^2.1.1",
"typewriter-effect": "^2.19.0"
},
"devDependencies": {
"autoprefixer": "^10.4.14",
"postcss": "^8.4.21",
"tailwindcss": "^3.2.7"
}
}
_app.js文件:
import '@/styles/globals.css'
export default function App({ Component, pageProps }) {
return <Component {...pageProps} />
}
_document.js文件:
import { Html, Head, Main, NextScript } from 'next/document'
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
下面是图片:Error image
1条答案
按热度按时间bybem2ql1#
仅从package.json很难判断,但从它提到
_document
的错误消息来看。上下文必须在
_app
中实现,而不是在_document
中实现,还要确保从react
导入useContext