"Uncaught SyntaxError: Unexpected token <" on new build using gatsby JS

[fool]

This post describes the reasons for the problem in more detail:

[Support Guide] Why do I see “Uncaught SyntaxError: Unexpected token <” errors? How can I use chunking or versioning for my assets at Netlify?

Last reviewed by Netlify Support on December 2022 The error Uncaught SyntaxError: Unexpected token < is most commonly caused by your site’s code referring to an asset that is no longer available. Most commonly, this is due to a filename change in assets generated during your build. The same situation happens if you use versioned or chunked javascript where the filename changes with every deploy. Let’s look at an example: A file that was named /assets/main-123abc.js would change to /assets…

It also has our best suggestions on working around it:

• ensure that you don’t use asset fingerprinted filenames wherever possible (this plugin may help: gatsby-plugin-remove-fingerprints | Gatsby) but also make sure that the netlify-plugin-gatsby isn’t setting your cache timeouts ridiculously, which it tends to do, assuming that the filenames will change with every deploy!)
• or have a client-side handler that notices such failures and forces a hard refresh to pick up a new “referring” page that will have references that are correct to filenames that may have changed due to you deploying that change, between the initial pageload and the followup click.

Removing your service worker is also a good idea to help with this, but it won’t address the root cause of “a page loaded into a browser before a deploy won’t find files you removed in a later deploy when it tries”.