CODEWITHSUNDEEP
htmlcssasp.net-mvcbundle
gsiradze
gsiradze

Reputation: 4733

Bundle works wrong for css

I have these css files included in layout

<!-- Dropdown Menu -->
<link rel="stylesheet" href="~/Content/superfish.css">
<!-- Date Picker -->
<link rel="stylesheet" href="~/Content/bootstrap-datepicker.min.css">
<!-- CS Select -->
<link rel="stylesheet" href="~/Content/cs-select.css">
<link rel="stylesheet" href="~/Content/cs-skin-border.css">
<!-- Themify Icons -->
<link rel="stylesheet" href="~/Content/themify-icons.css">
<!-- Flat Icon -->
<link rel="stylesheet" href="~/Content/flaticon.css">
<!-- Icomoon -->
<link rel="stylesheet" href="~/Content/icomoon.css">
<!-- Flexslider  -->
<link rel="stylesheet" href="~/Content/flexslider.css">
<!-- Style -->
<link rel="stylesheet" href="~/Content/style.css">

now I want to move these files in bundle so I did that:

public static void RegisterBundler(BundleCollection bundles)
    {
        bundles.Add(new StyleBundle("~/Content/style.css").Include(
            "~/Content/superfish.css",
            "~/Content/bootstrap-datepicker.min.css",
            "~/Content/cs-select.css",
            "~/Content/cs-skin-border.css",
            "~/Content/themify-icons.css",
            "~/Content/flaticon.css",
            "~/Content/icomoon.css",
            "~/Content/flexslider.css",
            "~/Content/style.css"
            ));

        BundleTable.EnableOptimizations = true;
    }

and in my layout:

@Styles.Render("~/Content/style.css")

but from this:

enter image description here

it goes to this:

enter image description here

some of css code is missing when i open this new css file (from browser developer tool). Especially whole first file is missing (superfish.css) but it is in the same folder as others

What did I wrong?

Upvotes: 0

Views: 156

Answers (2)

Karthik Elumalai
Karthik Elumalai

Reputation: 1612

Bundling is a new feature in ASP.NET 4.5 that makes it easy to combine or bundle multiple files into a single file.

The Bundle class Include method takes an array of strings, where each string is a virtual path to resource.

Change your code like below:

Note : remove the file extension inside the StyleBundle()

public static void RegisterBundler(BundleCollection bundles)
    {
       //

        bundles.Add(new StyleBundle("~/Content/style").Include(
            "~/Content/superfish.css",
            "~/Content/bootstrap-datepicker.min.css",
            "~/Content/cs-select.css",
            "~/Content/cs-skin-border.css",
            "~/Content/themify-icons.css",
            "~/Content/flaticon.css",
            "~/Content/icomoon.css",
            "~/Content/flexslider.css",
            "~/Content/style.css"
            ));

        BundleTable.EnableOptimizations = true;
    }

In Layout: Call like below

@Styles.Render("~/Content/style")

Hope it was helpful

Upvotes: 1

Morpheus
Morpheus

Reputation: 9065

It might get confused and renders the actual style.css instead of the bundle. Try changing the name of the bundle to something else, i.e. new StyleBundle("~/Content/main.css"). Also, you probably using the render wrong - it should be @Styles.Render("~/Content/style") (note the removed .css part)

Upvotes: 1

Related Questions