javascriptreactjsnext.jsruntime-errorapp-router

Why do i get a runtime error when i am trying to write a simple route in the new nextjs 13.5.4?

I get this error when trying to create a simple route app/dashboard/page.tsx where by an error occurs stating the contents are not a valid react component whilst they are actually valid react component syntax

Unhandled Runtime Error
Error: The default export is not a React Component in page: "/dashboard"

Call Stack
ew
/Users/mac/Documents/nextjs/rico_sub/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (13:19957)
async
/Users/mac/Documents/nextjs/rico_sub/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (13:20643)
async ew
/Users/mac/Documents/nextjs/rico_sub/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (13:20409)
async
/Users/mac/Documents/nextjs/rico_sub/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (13:20643)
async ew
/Users/mac/Documents/nextjs/rico_sub/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (13:20409)
async O
/Users/mac/Documents/nextjs/rico_sub/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (13:25264)
Solution

  • You need to define a function and export it like below :

    export default function page() {
  return (
    //HTML code
  )
}