首页 > 解决方案 > Next.js 带有 Failed prop 类型的错误:prop `href` 在 ` ` 中需要一个 `string` 或 `object`,但是却得到了 `undefined`。仅在本地机器上

问题描述

我有一个奇怪的错误,几天后突然开始发生,这让我很难过。我想知道是否有人遇到过这个问题,因为我对 React.JS 和 Next.JS 还很陌生

我在 GitHub 上有一个 Next.js 网站代码的自我管理私有存储库,它成功推送并部署到 Vercel。此代码也在本地工作。

由于同步 OneDrive 的一个不相关问题,我需要从一个干净的文件夹开始,其中包含我 Mac 上本地的代码。

所以我在 GitHub repo 上克隆了工作分支,添加了我的.env.local文件,运行npm install

当我npm run dev现在执行时,我得到了这个阶段错误,我已经尝试克服了几天,做了几次尝试。

Server Error
Error: Failed prop type: The prop `href` expects a `string` or `object` in `<Link>`, but got `undefined` instead.

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
createPropError
node_modules/next/dist/client/link.js (11:166)
eval
node_modules/next/dist/client/link.js (12:221)
Array.forEach
<anonymous>
Link
node_modules/next/dist/client/link.js (12:103)
processChild
file:///Users/user/code_repo/node_modules/react-dom/cjs/react-dom-server.node.development.js (3353:14)
resolve
file:///Users/user/code_repo/node_modules/react-dom/cjs/react-dom-server.node.development.js (3270:5)
ReactDOMServerRenderer.render
file:///Users/user/code_repo/node_modules/react-dom/cjs/react-dom-server.node.development.js (3753:22)
ReactDOMServerRenderer.read
file:///Users/user/code_repo/node_modules/react-dom/cjs/react-dom-server.node.development.js (3690:29)
renderToString
file:///Users/user/code_repo/node_modules/react-dom/cjs/react-dom-server.node.development.js (4298:27)
Object.renderPage
file:///Users/user/code_repo/node_modules/next/dist/next-server/server/render.js (53:854)

我根本无法在本地运行此代码。该代码包含几个实例<Link href="/XYZ">,它们过去都可以正常工作。我尝试删除所有这些链接,但错误仍然存​​在。

以下是我的 package.json:

{
    "name": "website",
    "version": "1.5.0",
    "description": "Website Code",
    "main": "index.js",
    "scripts": {
        "dev": "next",
        "build": "next build",
        "start": "next start",
        "export": "next export"
    },
    "author": "author",
    "license": "",
    "dependencies": {
        "@sls-next/serverless-component": "3.2.0",
        "animate.css": "^4.1.1",
        "meta": "^2.2.25",
        "next": "^11.0.1",
        "nodemailer": "^6.6.3",
        "rc-tooltip": "^5.1.1",
        "react": "^17.0.2",
        "react-accessible-accordion": "^3.3.3",
        "react-calendly": "^2.2.1",
        "react-dom": "^17.0.2",
        "react-google-recaptcha": "^2.1.0",
        "react-hotjar": "^3.0.1",
        "react-modal-video": "^1.2.8",
        "react-owl-carousel3": "^2.2.5",
        "react-tippy": "^1.4.0",
        "react-tooltip": "^4.2.21",
        "react-visibility-sensor": "^5.1.1",
        "sass": "^1.40.1",
        "semantic-ui-react": "^2.0.3"
    }
}

标签: reactjsnext.js

解决方案


推荐阅读