Unable to prefetch pages built from dynamic routes

[jamespohalloran]

Bug report

Describe the bug

I am using getStaticProps and getStaticPaths to generate static pages. When accessing my pages generated from a dynamic URL, it is trying to prefetch .js files based off of their slugs (and 404'ing) e.g prefetch request: /pages/docs/concepts/getting-started/introduction.js

The actual files in the build output static directory look like: /pages/docs/[...slug].js

To Reproduce

Create static pages using something like.

// [...slug].tsx
// ...
export async function unstable_getStaticPaths() {
  const contentDir = './content/docs/'
  const files = await glob(`${contentDir}**/*.md`)
  return files
    .map(file => {
      const path = file.substring(contentDir.length, file.length - 3)
      return { params: { slug: path.split('/') } }
    })
}

$ next export $ next out

The prefetching requests when navigating to these dynamic pages will 404

Expected behavior

Prefetching should either occur using the /pages/docs/[...slug].js url, or /pages/docs/[your_actual_page_slug].js should be added to the build output.

Screenshots

(blog, community, and teams are not dynamic pages, however the rest are).

Output from build

System information

• OS: macOS
• Browser chrome
• Version of Next.js: 9.2.2-canary.12

Additional context

Add any other context about the problem here.

[timneutkens]

Sounds like wrong usage of <Link>: https://nextjs.org/docs/api-reference/next/link#dynamic-routes

[jamespohalloran]

Ahh! Sorry about that. Missed this section in the docs. Thanks!!

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.