Description
Describe the bug
We have a NextJS app that uses NetlifyCMS as the backend. We have a catch-all [...slug].js that handles generic routes as well as pages that handle specific routes. In both cases, these pages are wrapped in the same _app.js as well as a Layout component that preloads fonts and analytics (you can see this in the head of the /homepass/ route below).
Pages made via file based routing work on production, however pages generated by [...slug].js don't seem to be working. They don't throw a 404, but they also don't load any JS.
These [...slug].js pages work locally running next dev, as well as running next build && next start. They also work as expected when running netlify dev.
To Reproduce
Steps to reproduce the behavior:
Page generated with /homepass/index.js: https://60f5f123b56f86000722e3b1--plume-new-shop.netlify.app/homepass
Page generated with [...slug].js: https://60f5f123b56f86000722e3b1--plume-new-shop.netlify.app/homepass/shop
It also look like some of the chunks that are present in the html from a local netlify build are not present when hitting the /homepass/shop route. Below is the head from the shop.html file. Note that the chunks aren't present when hitting the route. Similar chunks are present when hitting the /homepass route.
<head>
<meta charSet="utf-8"/>
<meta name="viewport" content="width=device-width"/>
<meta name="next-head-count" content="2"/>
<link rel="preload" href="/_next/static/css/0a9b5017bb86c6d6d0d4.css" as="style"/>
<link rel="stylesheet" href="/_next/static/css/0a9b5017bb86c6d6d0d4.css" data-n-g=""/>
<noscript data-n-css=""></noscript>
<script defer="" nomodule="" src="/_next/static/chunks/polyfills-a54b4f32bdc1ef890ddd.js">
</script><script src="/_next/static/chunks/webpack-ab5a8de0364332653952.js" defer=""></script>
<script src="/_next/static/chunks/framework-c93ed74a065331c4bd75.js" defer=""></script>
<script src="/_next/static/chunks/main-dffd1de1eb936205c3df.js" defer=""></script>
<script src="/_next/static/chunks/pages/_app-b00df0a79317fa123a7e.js" defer=""></script>
<script src="/_next/static/chunks/pages/%5B...slug%5D-4ab3838ffbebd37ca119.js" defer=""></script>
<script src="/_next/static/pHFfwXOnWJl8pY86rO_7I/_buildManifest.js" defer=""></script>
<script src="/_next/static/pHFfwXOnWJl8pY86rO_7I/_ssgManifest.js" defer=""></script>
<style data-styled="" data-styled-version="5.3.0"></style>
</head>Expected behavior
Pages generated by [...slug].js should exhibit the same behavior as those made by file system specific pages.
Versions
- Next.js: 11.0.0
- plugin (if installed at fixed version): N/a (uninstalled to use latest on build)
If you're using the CLI to build
- OS: Mac
- netlify/cli version: 4.4.2
If you're using file-based installation
- netlify.toml:
# Settings in the [build] context are global and are applied to all contexts
# unless otherwise overridden by more specific contexts.
[build]
# Directory (relative to root of your repo) that contains the deploy-ready
# HTML files and assets generated by the build. If a base directory has
# been specified, include it in the publish directory path.
publish = "out"
# Default build command.
command = "yarn build"
# Directory with the serverless Lambda functions to deploy to AWS.
functions = "functions"
[dev]
command = "yarn dev"
functions = "functions"
framework = "#auto"