[NEXT-1049] use client with generateStaticParams will opt out of static generation

[lforst]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
      Platform: linux
      Arch: x64
      Version: Ubuntu 20.04.0 LTS Fri Mar 03 2023 15:26:27 GMT+0100 (Central European Standard Time)
    Binaries:
      Node: 16.14.2
      npm: 7.17.0
      Yarn: 1.22.19
      pnpm: 7.13.6
    Relevant packages:
      next: 13.2.4-canary.1
      eslint-config-next: N/A
      react: 18.2.0
      react-dom: 18.2.0

Which area(s) of Next.js are affected? (leave empty if unsure)

App directory (appDir: true)

Link to the code that reproduces this issue

https://stackblitz.com/edit/vercel-next-js-n6ugu2?file=app/[param]/page.tsx

To Reproduce

• run yarn && yarn next build
• examine that/[param] is always SSR

Describe the Bug

The /[param] page/component is server side rendered.

Expected Behavior

The /[param] page/component should be SSG.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

_NEXT-1049

[timneutkens]

The Next.js specific exports like generateStaticParams, metadata, and generateMetadata are only supported on the layout/page if it's a server component. By opting in to client components using 'use client' these are not considered which is why you're seeing them have no effect at all. The docs need to make this clearer on the generateStaticParams page, we'll get that fixed.
Additionally there needs to be a warning/error when these exports are added to files that have 'use client'.

[delbaoliveira]

Added a note in the beta docs, and the new docs we're building which be much clearer in what circumstance each API is supported.

[lforst]

Thanks @timneutkens and @delbaoliveira! :)

[lazaro-contato]

@timneutkens I'm trying to migrate a Vite project to NextJs following this steps: https://nextjs.org/docs/app/building-your-application/upgrading/from-vite

I created the page inside the app directory "src/app/[[...slug]]/page"
I put the code to render all the app in the client side:

'use client'

import React from 'react'
import dynamic from 'next/dynamic'

const App = dynamic(() => import('../../App'), {ssr: false})

const Page = (): JSX.Element => {
  return <App />
}

export default Page

but when I try to run the project the same error happens.

Error: Page "/[[...slug]]/page" is missing exported function "generateStaticParams()", which is required with "output: export" config.

But since the page it is a client side, why should I add the generateStaticParams()?

here is my next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export', // Outputs a Single-Page Application (SPA).
  distDir: './dist', // Changes the build output directory to `./dist/`.
}

export default nextConfig

[etczrn]

@lazaro-contato I am not sure this is going to help you, but using the version 13.4.19 works for me. Maybe higher version would be the problem or something. Here's the link I saw.

[samcx]

Closing this issue since this was explained above!

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.