Next.js自定义应用程序getInitialProps TypeError

Question

我的Next JS入门工具包有一个非常简单的应用程序，我正在尝试使其与docs here中指定的自定义应用程序一起使用：

class MyApp extends App {
  static async getInitialProps({ Component, router, ctx }) {
    let pageProps = {};
    const isAuthenticated = await (process.browser
      ? Auth0Client.clientAuth()
      : Auth0Client.serverAuth(ctx.req));

    console.log("isAuthenticated: ", isAuthenticated);

    if (Component.getInitialProps) pageProps = await App.getInitialProps(ctx);

    const auth = { isAuthenticated };
    return { pageProps, auth };
  }

  render() {
    const { Component } = this.props;
    return <Component auth={this.props.auth} />;
  }
}

它放置在pages文件夹的_app.js内。

问题是我的索引页也有静态

static async getInitialProps

，由于某种原因，它会触发以下错误：

TypeError: Cannot read property 'prototype' of undefined

您可以通过以下URL在此处查看我的_app.js文件： https://github.com/bodrovphone/next-app/blob/breakingPoint/pages/_app.js

此处为index.js文件的URL： https://github.com/bodrovphone/next-app/blob/breakingPoint/pages/index.js

复制步骤：

1. 克隆项目at this branch
2. npm安装
3. npm run dev
4. 导航到localhost：3000

我将不胜感激！

Answer 1

您需要每次运行各自的Component的{​​{1}}，而不是getInitialProps。

在以下行中更改您的 _app.js ：

App

到

if (Component.getInitialProps) pageProps = await App.getInitialProps(ctx);

我希望这能解决您的问题。