Export default Error: The default export is not a React Component in page: "/"-CodePudding

I am trying to build a next app and am receiving this error. Most the replies I see about this are around not using export default which I am doing!

I am basically trying to create a wrapper around my pages so that I can add things like a nav footer etc.

views/createView:

    const createView: FC = (View: FC) => {
      return (
        <div>
          <View/>
        </div>
      )
    }



export default createView;

pages/idx

import createView from 'views/createView';

const homePage: FC = () => {
  return (
    <div>hi</div>
  )
}

export default createView(homePage);

The code works when I directly return the view but not if I do anything else.

const createView: FC = (View: FC) => View

HELP :(

CodePudding user response：

Maybe try

const createView: FC = (View: FC) => {
      return (
        <div>
          {View}
        </div>
      )
    }



export default createView;

CodePudding user response：

Remember, component name always be CamelCase and router/page should be small letter. if you are using vscode then you can use this extension extension

and short code for component is rafce