Nextjs getInitialProps 错误阻止在 Netlify 上构建

Question

嘿伙计们，我继承了一个用 nextjs 构建并在 Netlify 上运行的项目。 我正在尝试在用户使用 IE 时加载组件。 在本地，我可以毫无问题地渲染组件视图。 但是当构建运行（代码推送到特定分支）时，构建在 Netlify 上失败。 Netlify 似乎不喜欢以下内容。

const userAgent = props ? props.req.headers['user-agent'] : navigator.userAgent

接受任何建议。 我是 Netlify 的新手，只是试图显示一个让用户知道他们的浏览器不受支持的组件。 下面是我在 _document.js 中的代码

_document.js

class MyDocument extends Document {

 static async getInitialProps(props) {
  const page = props.renderPage()
  const userAgent = props ? props.req.headers['user-agent'] : navigator.userAgent

  return {
    ...page,
    userAgent
  }
 }

renderBrowserSupport() {
  let msie = this.props.userAgent.indexOf('MSIE ');
  let ie11 = this.props.userAgent.indexOf('Trident/');

  if(msie > 0 || ie11 > 0) {
    return (
      <BrowserSupport/>
    )
  }

  else return false;
}

render() {
  <html lang="en">

  <body>
  {this.renderBrowserSupport()}
  </body>

  </html>
 }
}

export default MyDocument

运行 npm 运行构建时出错

Cannot read property 'user-agent' of undefined

Answer 1

我在向 _document.js 添加代码时遇到了几个问题，所以我采用了不同的方法，如下所示：

创建了一个路由更新浏览器
向 IE 添加了一个带有消息传递和替代浏览器的组件
添加脚本以检查浏览器是 IE 11 还是 IE，如果是，则重定向到更新浏览器页面

Nextjs getInitialProps 错误阻止在 Netlify 上构建

问题描述

1 个解决方案

解决方案1
0 已采纳 2019-10-31 22:46:25

Nextjs getInitialProps 错误阻止在 Netlify 上构建

问题描述

1 个解决方案

解决方案1 0 已采纳 2019-10-31 22:46:25

解决方案1
0 已采纳 2019-10-31 22:46:25