Adding bootstrap in bundleconfig doesn't work in asp.net mvc

46,504

When using Bundle, do not append the .min

bundles.Add(new StyleBundle("~/Content/bootstrap").Include(
    "~/Content/bootstrap.css", 
    "~/Content/bootstrap-theme.css"));

Based on the debug setting, (mostly web.config)

  • debug="true" - the non minified version will be used.
  • debug="false" - *.min.css will be searched, and if not found, the current will be minified

web.config setting:

<system.web>
  <compilation debug="true"...
Share:
46,504
Snake Eyes
Author by

Snake Eyes

I love PHP, MySQL, ASP.NET, SqlServer and Javascript (including Jquery)

Updated on November 26, 2020

Comments

  • Snake Eyes
    Snake Eyes over 3 years

    I met an issue, strange in my point of view.

    I installed bootstrap via nuget package console.

    After that, in BundleConfig.cs file, I added two items to bundles list:

    bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                        "~/Scripts/bootstrap.min.js"));
    
    bundles.Add(new StyleBundle("~/Content/bootstrap").Include(
                         "~/Content/bootstrap.min.css", 
                         "~/Content/bootstrap-theme.min.css"));
    

    Of course, these files exist locally.

    The _Layout.cshtml file contains

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width" />
        <title>@ViewBag.Title</title>
        @Styles.Render("~/Content/css")
        @Scripts.Render("~/bundles/modernizr")
        @Styles.Render("~/Content/bootstrap")
    
    </head>
    <body>
        @RenderBody()
    
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/bootstrap")
        @RenderSection("scripts", required: false)
    </body>
    </html>
    

    But when I see a view (for example login page), I see that bundle doesn't append bootstrap part.

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width" />
        <title>Login</title>
        <link href="/Content/Site.css" rel="stylesheet"/>
        <script src="/Scripts/modernizr-2.6.2.js"></script>    
        <!-- I expect bootstrap here but it is not displayed -->
    </head>
    <body>
    
    ...
    
    <script src="/Scripts/jquery-1.9.1.js"></script>
    <!-- I expect bootstrap here but it is not displayed -->
    </body>
    </html>