Search code examples
asp.net-mvcgoogle-chromemime-types

ASP MVC Resource interpreted as Stylesheet but transferred with MIME type application/javascript


I'm used to reference all my css and js file without bundling like this :

<link rel='stylesheet' type='text/css' href='style.css'/>

But since I use Bundling I get the following error message in chrome:

Resource interpreted as Stylesheet but transferred with MIME type application/javascript: "http://localhost:9432/Assets/global/plugins/bootstrap/js/bootstrap.min.js".

I found that I should set Content-Type to application/javascript but I don't how can I do this.

Whats your suggestion for resolve this problem?

UPDATE:

Here is my code:

          bundles.Add(new StyleBundle("~/bundles/AdminStyle").Include(
                  "~/Assets/global/plugins/font-awesome/css/font-awesome.min.css",
                  "~/Assets/global/plugins/simple-line-icons/simple-line-icons.min.css",
                  "~/Assets/global/plugins/bootstrap/css/bootstrap-rtl.min.css",
                  "~/Assets/global/plugins/bootstrap-switch/css/bootstrap-switch-rtl.min.css",
                  "~/Assets/global/plugins/bootstrap-select/css/bootstrap-select-rtl.css",
                  "~/Assets/global/css/components-rounded-rtl.min.css",
                  "~/Assets/global/css/plugins-rtl.min.css",
                  "~/Assets/layouts/layout3/css/layout-rtl.min.css",
                  "~/Assets/layouts/layout3/css/themes/default-rtl.min.css",
                  "~/Assets/layouts/layout3/css/custom.css",
                  "~/Assets/global/plugins/bootstrap-social-button/css/bootstrap-social.css",
                  "~/Assets/global/plugins/bootstrap-toastr/toastr.min.css",
                  "~/Assets/global/css/Custom.css",
                  "~/Assets/global/css/helper.css"));

And

 bundles.Add(new StyleBundle("~/bundles/AdminScript").Include(
      "~/Assets/global/plugins/bootstrap/js/bootstrap.min.js",
      "~/Assets/global/plugins/js.cookie.min.js",
      "~/Assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js",
      "~/Assets/global/plugins/jquery.blockui.min.js",
      "~/Assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js",
      "~/Assets/global/scripts/app.min.js",
      "~/Assets/layouts/layout3/scripts/layout.min.js",
      "~/Assets/layouts/layout3/scripts/demo.min.js",
      "~/Assets/layouts/global/scripts/quick-sidebar.min.js",
      "~/Assets/layouts/global/scripts/quick-nav.min.js",
      "~/Assets/global/plugins/bootstrap-select/js/bootstrap-select.min.js"));

Solution

  • You are rendering js file as <link rel="stylesheet" href="/bundles/....">

    So, in your cshtml, change @Styles.Render("~/bundles/AdminScript") to @Scripts.Render("~/bundles/AdminScript")