文章/答案/技术大牛

发布

社区首页 >问答首页 >react图标模块导致next.js ReferenceError: document未定义

问react图标模块导致next.js ReferenceError: document未定义
EN

Stack Overflow用户

提问于 2022-03-10 08:25:50

回答 1查看 457关注 0票数 0

因此，正如标题所述，我试图使用react图标模块，但它会导致引用错误。

我用命令yarn add react-icons安装了模块。，这是详细信息

wait  - compiling /_error (client and server)...
event - compiled client and server successfully in 181 ms (249 modules)
ReferenceError: document is not defined
    at new StyleSheet (/node_modules/styled-jsx/dist/index/index.js:136:35)
    at new StyleSheetRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:491:33)
    at Object.createStyleRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:667:10)
    at Object.renderToHTML (pathToProject/node_modules/next/dist/server/render.js:364:46)
    at async doRender (pathToProject/node_modules/next/dist/server/base-server.js:879:38)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (pathToProject/node_modules/next/dist/server/base-server.js:979:28)
    at async pathToProject/node_modules/next/dist/server/response-cache.js:64:36
ReferenceError: document is not defined
    at new StyleSheet (pathToProject/node_modules/styled-jsx/dist/index/index.js:136:35)
    at new StyleSheetRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:491:33)
    at Object.createStyleRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:667:10)
    at Object.renderToHTML (pathToProject/node_modules/next/dist/server/render.js:364:46)
    at async doRender (pathToProject/node_modules/next/dist/server/base-server.js:879:38)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (pathToProject/node_modules/next/dist/server/base-server.js:979:28)
    at async pathToProject/node_modules/next/dist/server/response-cache.js:64:36
ReferenceError: document is not defined
    at new StyleSheet (pathToProject/node_modules/styled-jsx/dist/index/index.js:136:35)
    at new StyleSheetRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:491:33)
    at Object.createStyleRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:667:10)
    at Object.renderToHTML (pathToProject/node_modules/next/dist/server/render.js:364:46)
    at async doRender (pathToProject/node_modules/next/dist/server/base-server.js:879:38)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (pathToProject/node_modules/next/dist/server/base-server.js:979:28)
    at async pathToProject/node_modules/next/dist/server/response-cache.js:64:36
ReferenceError: document is not defined
    at new StyleSheet (pathToProject/node_modules/styled-jsx/dist/index/index.js:136:35)
    at new StyleSheetRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:491:33)
    at Object.createStyleRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:667:10)
    at Object.renderToHTML (pathToProject/node_modules/next/dist/server/render.js:364:46)
    at async doRender (pathToProject/node_modules/next/dist/server/base-server.js:879:38)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (pathToProject/node_modules/next/dist/server/base-server.js:979:28)
    at async pathToProject/node_modules/next/dist/server/response-cache.js:64:36
ReferenceError: document is not defined
    at new StyleSheet (pathToProject/node_modules/styled-jsx/dist/index/index.js:136:35)
    at new StyleSheetRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:491:33)
    at Object.createStyleRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:667:10)
    at Object.renderToHTML (pathToProject/node_modules/next/dist/server/render.js:364:46)
    at async doRender (pathToProject/node_modules/next/dist/server/base-server.js:879:38)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (pathToProject/node_modules/next/dist/server/base-server.js:979:28)
    at async pathToProject/node_modules/next/dist/server/response-cache.js:64:36
ReferenceError: document is not defined
    at new StyleSheet (pathToProject/node_modules/styled-jsx/dist/index/index.js:136:35)
    at new StyleSheetRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:491:33)
    at Object.createStyleRegistry (pathToProject/node_modules/styled-jsx/dist/index/index.js:667:10)
    at Object.renderToHTML (pathToProject/node_modules/next/dist/server/render.js:364:46)
    at async doRender (pathToProject/node_modules/next/dist/server/base-server.js:879:38)
    at async cacheEntry.responseCache.get.isManualRevalidate.isManualRevalidate (pathToProject/node_modules/next/dist/server/base-server.js:979:28)
    at async pathToProject/node_modules/next/dist/server/response-cache.js:64:36
error - unhandledRejection: ReferenceError: document is not defined
error - unhandledRejection: ReferenceError: document is not defined
error - unhandledRejection: ReferenceError: document is not defined
error - unhandledRejection: ReferenceError: document is not defined
error - unhandledRejection: ReferenceError: document is not defined
error - unhandledRejection: ReferenceError: document is not defined

node.js

reactjs

next.js

yarnpkg

react-icons

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-03-10 09:15:32

通过禁用服务器端呈现来解决此问题。

import dynamic from "next/dynamic"

const SetupMavlink = dynamic(() => import("components/SetupMavlink"), {ssr:false})


export default function Home() {
  return (
    <div >
      <SetupMavlink />
    </div>
  )
}

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/71420906

复制

相似问题

问react图标模块导致next.js ReferenceError: document未定义
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问react图标模块导致next.js ReferenceError: document未定义EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问react图标模块导致next.js ReferenceError: document未定义
EN