Next.js: with-flow getInitialProps issue property `getInitialProps`. Property not found in 21: Index.getInitialProps = (context) => { statics of Index

Created on 25 Nov 2017  路  4Comments  路  Source: vercel/next.js


I'm trying to integrate Flow with my current next project I notice there is a issue with
getInitialProps method. Flow complains:
screen shot 2017-11-25 at 13 49 09

I'm a little bit confused do I have to specify
static getInitialProps: (ctx: {pathname: string, query: any, req?: any, res?: any, jsonPageRes?: any, err?: any}) => Promise<any>;
for every page or it could be done with next.js.flow file?
I see there is definition within the file

declare module "next/document" {
  declare export var Head: Class<React$Component<any, any>>;
  declare export var Main: Class<React$Component<any, any>>;
  declare export var NextScript: Class<React$Component<any, any>>;
  declare export default Class<React$Component<any, any>> & {
    getInitialProps: (ctx: {pathname: string, query: any, req?: any, res?: any, jsonPageRes?: any, err?: any}) => Promise<any>;
    renderPage(cb: Function): void;
  };
}

But it seems this definition already have some problems. Please note I tried with flow-bin version specified in the example, but I also tried with newest flow-bin and it seems the same.

  • [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

I think this has to work automatically if it's well defined within the next.js.flow file

Steps to Reproduce (for bugs)

  1. Take with-flow example
  2. Change index.js page to be statefull component and add getInitialProps to it
  3. run yarn flow

Your Environment

| Tech | Version |
|---------|---------|
| next | latest |
| node | 8.7.0 |
| OS | OSX |

example

Most helpful comment

@adrianmcli I just put
static getInitialProps: (any) => any;
in every page. IE:

class Index extends React.Component<Props, State> {

    static getInitialProps: (any) => any;

    render() {

But I think there must be a better way of doing it, some global pattern or something 馃

All 4 comments

@davscro have you found a solution to this? I'm setting up a new project and ran into something similar.

@adrianmcli I just put
static getInitialProps: (any) => any;
in every page. IE:

class Index extends React.Component<Props, State> {

    static getInitialProps: (any) => any;

    render() {

But I think there must be a better way of doing it, some global pattern or something 馃

Here is an example of how to type getInitialProps from the docs.
https://github.com/zeit/next.js/blob/canary/examples/with-flow/flow-typed/next.js.flow

I know this issue is closed but this is what my logic dictates me

type Props = { title: string };
type initialProps: (ctx: {[string]: any}) => Promise<Props>;

class Index extends React.Component<Props>{
  static getInitialProps: initialProps;

  ...
}

Index.getInitialProps = async (ctx) => {
   ...
   return { title: "Hi" };
}
Was this page helpful?
0 / 5 - 0 ratings

Related issues

knipferrc picture knipferrc  路  3Comments

wagerfield picture wagerfield  路  3Comments

flybayer picture flybayer  路  3Comments

sospedra picture sospedra  路  3Comments

pie6k picture pie6k  路  3Comments