I have a site running on React Static, which works flawlessly locally in both development and production build modes.
After including a large section of my site to the build, with about 1000 pages, the build no longer works on Netlify. I don’t get any errors in the deployment log nor does the build time, being about 9 minutes, get even close to the timeout limit of 15 minutes. Seemingly everything goes through successfully.
Also, the build instantly starts working if I limit the number of these pages on the backend to e.g. 200.
What could be causing such an issue, and is there anything I can do to prevent it from happening, or at least see what is not working correctly in order to debug it?
Could you link us to your deploy logs so we can see what “silently” looks like in more detail? Usually there is something, but even the complete lack of something might be enough to give us some more clues.
Here are the logs for the deploy that breaks (total routes 1469):
Here is a fully working one, in which I have limited the number of articles in two different places to 100 (total routes 792):
Like mentioned, the full build works as expected on locally even when building for production.
I have also tested to render a dummy template instead of the actual HTML in case it was a bug with inconsistent CMS content deeper down.
When trying to access the broken build, the static HTML splashes quickly, but when React kicks in the page goes blank with the following in the console: vendors~main.c3599e8b.js?__sbCache=0.24341778749696275:1 Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. - not that helpful either.
Hi, @hellojere. To debug, we need to examine the Netlify site itself. Would you please send us the URL to the deploy logs at Netlify?
If you don’t want to share the site name, the site ID (not the API key but the site ID) can be used to tell us what site this is. The site ID along with the day/time/timezone of the non-working deploy will help us to identify the correct one.
With this information we’l be able to examine the site/deploy and provide more information about the root cause of the issue.
I’ll keep the broken as it is until I get a response here, but I will be further improving the production, so in case that has issues when you’re looking at it, they’re unrelated.
It doesn’t look like the build failed as it did not exist with a non-zero code. If your build is failing to build all your pages, it should exit with a non-zero code to let our buildbot know it failed. As far as our buildbot knows, your build was successful and so it deployed it.
I also checked your build logs and did not see any errors.
With regards to the error you are seeing in your browser console, that error is specifically related to your site’s code. Perhaps, you can compare the difference in your branches (master vs development) to see where the issue might be.
Thanks for your response. But like I mentioned earlier, this works flawlessly locally when building the same way as its being built on Netlify. On top of this, even when rendering a dummy component instead of the real thing, limiting the number of possible bugs, it still fails on Netlify.
Have you tried debugging your build using the same build-image that our buildbot does? It’s the ‘what next?’ section of the ‘debugging your build’ post. Hopefully that helps you narrow things down further.
Hi, I was able to reproduce the same issue on azure devops and locally
just adding too many pages under the pages folder of the initial solution of react static and then npm run build
So, it likely isn’t a netlify specific issue.
The solution in my case:
const Main = React.lazy(() => import( './Main '))
lazy loading the main component that contained the several components having apexchart in them
still do not know why it worked without it for a few pages but broke when more was added though, seems like some switch happens during the exporting HTML step depending on the number of pages.
