Netlify.toml + redirect may have broken my next.js app

[Fawwaz-2009]

So the pages seem to be rendering fine, however the react part is not. After looking in the console and seeing the following message I think the reason is that the scripts just failed to load.

The log from the console

The resource was preloaded using link preload but not used within a few seconds from the window’s load event. Please make sure it has an appropriate as value and it is preloaded intentionally.

The reason why I think the addition of netlify.toml maybe causing this, is because the build prior to adding it, did not include the log above and the react part of the app was working fine.

this all what netlify.toml contained
[[redirects]]
from = “mail.homeinajar.com”
to = “https://mail.google.com/a/homeinajar.com”
status = 200

this is the link prior to adding netlify.toml file https://5f64bb2fc6a36f00089717dd--home-in-a-jar.netlify.app/en

and this the one after https://5f64d7a7e73c2d0007fcedad--home-in-a-jar.netlify.app/en

this weird problem still continue even after deleting the netlify.toml file, can you guys please help

[gregraven]

@Fawwaz-2009 This redirect shouldn’t change the way your site loads, but then, it also shouldn’t work. [Full disclosure: I have no idea what you’re trying to accomplish with this redirect.]

According to the documentation, domain-level redirects such as this need to specify the communication protocol.

Redirect options

… which would give you something like:

from = “https://mail.homeinajar.com”

I don’t use React so I cannot comment on the underlying issue. Sorry.

[Fawwaz-2009]

thanks @gregraven, really the redirect is a secondary issue now. however I’m trying really hard to find another explanation on to why this bug exist, and I keep coming back that it only exist on netlify and it only started to happen after the addition of the netlify.toml .

Finally and this the weirdest part of all. Today, I’ve pushed the changes from when the code was working fine (before the addition of netlify.toml) to a new branch to have it build again on netlify and the same problem occurred.

This means that the exact same code for a build after the addition and deletion of netlify.toml does not work, while the same code for the build prior to the addition of netlify.toml works fine

[Fawwaz-2009]

So I’ve deployed the same repo into a new netlify project and the problem went a way. though still don’t know why the addition of netlify.toml is causing this weird bug in the old repo.

For now I know as a last resort I can switch the dns to the new project, but in the meantime anyone has context on why this problem happening

[Pie]

The question I’d be asking is… what else is in the netlify.toml?

[Fawwaz-2009]

hey @Pie here is a pic of the commit changes. It’s a really weird bug because as I managed to deploy the same code into a separate netlify project and worked fine.

[Pie]

I’ve taken another look at this. Both of your earlier examples actually work for me, on closer inspection?!

Also, that redirect rule won’t work, as Greg pointed out – you’ll want to configure a DNS record to get that redirect working.

Happy to discuss further but I’m struggling to see the issue now !

[Fawwaz-2009]

Hey @Pie sorry to have missed your message man. First I get that this a very confusing bug and maybe I should’ve added some more pics to highlight the issue better in the original post.
Second, I want to say again that I really don’t care if the redirect works at this point and the netlify.toml file has been already deleted.

Finally to better highlight the issue I made these two gifs comparing the website in local vs in Netlify

In Local

in Netlify

[luke]

Hi, @Fawwaz-2009. The asset optimization feature is the root cause:

Post processing

The javascript chunks are being bundled twice. Once by the site build process and once by the post processing. However, our bundler isn’t removing the preload directives from the HTML so they are loaded but not used as the console states.

Only the new bundle is used but the old bundles are being preloaded still when they no longer should be.

The solution for this will be to disable the javascript minifying/bundling post-processing for this site. If that doesn’t resolve the issue, please let us know.

[Fawwaz-2009]

Hey @luke so I disabled all assets optimizations and that seemed to to fix it, thanks a lot