The stylesheet was not loaded because its MIME type, “text/html”, is not “text/css”

Hi everyone,

I Built a MERN application and hosted the backend on Heroku, frontend on Netlify. On Localhost all the assets are loading fine and all pages work. Since my client is deployed on Netlify, my pages stop loading because of the MIME type, “text/html”, is not “text/css” error.

I’ve read a bit about it in here on the forum and tried out some fixes that are available here on the Netlify community/support but could not solve the issue.

Is there someone who can tell me what would be a appropriate configuration of my netlify.toml file to make sure the assets are loading and the error can be resolved? Or if it is another problem, please point me in the right direction!

The current configuration of my netlify.toml file is the following:

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

Site name: bap-nmd-2020-2021
Site domain: https://bap-nmd-2020-2021.netlify.app/

If more information is needed concerning my project setup I would of course be glad to provide that.

Thanks in advance!

I’m not getting any such error:

Is there a particular URL or something where this is happening?

1 Like

I’m not seeing this error, either.

1 Like

It’s weird, I am testing now as well and the errors are gone. I did change a few things in my index.html and added netlify.toml instead of the _redirects file I used earlier. So it’s kinda hard to tell which solved the issue.

For now I think it’s ok …

Thank you very much for looking into it!

Now the problem occurs on this url/page.

https://bap-nmd-2020-2021.netlify.app/reset/8767897

:thinking:

So it is not totally solved I’m afraid …

What could be a possible explanation?

For the record , on localhost this url works without any problem

Does you package.json have a homepage field? If not, maybe adding that would help.

Additionally, you can try adding a <base> tag to your index.html in public folder. It can look like:

<head>
  <base href = "yourdomain.com">
</head>

My package.json has a homepage field. Atm this is it’s value:

"homepage": "./",

Is this value correct?

For the base tag, where should I put it best? Above link imports or below or it makes no difference?

Thanks!

Try setting your website’s address there.

Doesn’t make a difference.

Keep getting the same problem every now and than, totally don’t get it …

index.html → <base href="https://www.popapp.be">

package.json → "homepage": "https://www.popapp.be",

I need to defend my application for university next week and if this bug keeps messing up it will be kind of a disaster.

Is there anything more I can do to fix this for once and for all?

I tried on incognito browser tabs and even then the problem is there. Only a force reload is working to load my application but this is not the intention.

On localhost everything works perfectly fine so could it be possible to provide a solution for me?

My url https://www.popapp.be/

error in Chrome → Uncaught SyntaxError: Unexpected token '<'
error in Firefox → MIME type, “text/html”, is not “text/css”

Thanks in advance!

Regards

I just opened your website and it seems to work fine. I’m not getting the errors you mentioned. Is there something specific that I can try to reproduce the behaviour or is it random?

Unless removing “homepage”: “./”, line in your package.json breaks your app, you can try removing it.

thanks for providing this info to the thread.