将js包含在asp.net应用程序的Bundle.config中

Question

I am trying to bundle my css & js of my asp.net web application. CSS works fine but it also take js files as css. May Be I have done some misconfiguration. When I dubug my application & looking at page source it gives shows like this.

<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/Site.css" rel="stylesheet"/>
<link href="/Content/owlcarousel.css" rel="stylesheet"/>
<link href="/Scripts/jquery.js" rel="stylesheet"/>
<link href="/Scripts/owlcarousel.js" rel="stylesheet"/>

Bundle.config

<?xml version="1.0" encoding="utf-8" ?>
<bundles version="1.0">
  <styleBundle path="~/Content/css">
    <include path="~/Content/bootstrap.css" />
    <include path="~/Content/Site.css" />
    <include path="~/Content/owlcarousel.css" />
  </styleBundle>

  <scriptBundle path="~/Scripts/js">
    <include path="~/Scripts/jquery.js" />
    <include path="~/Scripts/owlcarousel.js" />
  </scriptBundle>
</bundles>

MasterPage

<asp:PlaceHolder runat="server">
        <%: Scripts.Render("~/bundles/modernizr") %>
    </asp:PlaceHolder>
    <webopt:bundlereference runat="server" path="~/Content/css" />
    <webopt:bundlereference runat="server" path="~/Scripts/js" />

Answer 1

While I don't know the exact why's of the solution, I can hazard a few guesses.

It appears you need to use <asp:PlaceHolder runat="server"><%: Scripts.Render("~/Scripts/js") %></asp:PlaceHolder> to get the Bundle.config scriptBundle reference to render correctly.

I saw an article during my search (sadly lost now) noting that "webopt:BundleReference" makes a call to Styles.Render...which is what I suspect you and I experienced, namely that Microsoft apply Styles.Render to scriptBundle references instead of Scripts.Render!