vue.js - Refused to apply style from '' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled

Question

I have a Vue.js project, when I check the console found this issue bellow:

Refused to apply style from 'http://localhost:8080/dist/cropper.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

---

I searchedSO, found a Angular related post, but it do not helps me, they are based on different frontend framework.

Answer 1

The usual reason for this error message is that when the browser tries to load that resource, the server returns an HTML page instead, for example if your router catches unknown paths and displays a default page without a 404 error. Of course that means the path does not return the expected CSS file / image / icon / whatever.

To make sure you are in that case, copy the path and try to access it directly in a new browser window or tab. You will see what your server sends.

The solution is to find the correct path and router configuration so that you get your plain CSS file / image / etc. when accessing that path.

The exact path and router configuration depends on how you have setup your project and the framework you are using.